@hbslovely/baby-feeding 2026.7.1 → 2026.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -14529,11 +14529,9 @@ class HeroHeaderComponent {
|
|
|
14529
14529
|
this.weightLabel = input(null, ...(ngDevMode ? [{ debugName: "weightLabel" }] : /* istanbul ignore next */ []));
|
|
14530
14530
|
this.isAnyLoading = input(false, ...(ngDevMode ? [{ debugName: "isAnyLoading" }] : /* istanbul ignore next */ []));
|
|
14531
14531
|
this.showRefresh = input(true, ...(ngDevMode ? [{ debugName: "showRefresh" }] : /* istanbul ignore next */ []));
|
|
14532
|
-
this.editProfile = output();
|
|
14533
|
-
this.deleteProfile = output();
|
|
14534
|
-
this.openSettings = output();
|
|
14535
|
-
this.openAbout = output();
|
|
14536
14532
|
this.refresh = output();
|
|
14533
|
+
/** Hamburger trên hero → mở float menu (xử lý ở parent). */
|
|
14534
|
+
this.openMenu = output();
|
|
14537
14535
|
}
|
|
14538
14536
|
get genderEmoji() {
|
|
14539
14537
|
const g = this.profile().gender;
|
|
@@ -14556,12 +14554,12 @@ class HeroHeaderComponent {
|
|
|
14556
14554
|
return parts.join(' ');
|
|
14557
14555
|
}
|
|
14558
14556
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: HeroHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14559
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: HeroHeaderComponent, isStandalone: true, selector: "app-hero-header", inputs: { profile: { classPropertyName: "profile", publicName: "profile", isSignal: true, isRequired: true, transformFunction: null }, age: { classPropertyName: "age", publicName: "age", isSignal: true, isRequired: true, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: true, transformFunction: null }, weightLabel: { classPropertyName: "weightLabel", publicName: "weightLabel", isSignal: true, isRequired: false, transformFunction: null }, isAnyLoading: { classPropertyName: "isAnyLoading", publicName: "isAnyLoading", isSignal: true, isRequired: false, transformFunction: null }, showRefresh: { classPropertyName: "showRefresh", publicName: "showRefresh", isSignal: true, isRequired: false, transformFunction: null } }, outputs: {
|
|
14557
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: HeroHeaderComponent, isStandalone: true, selector: "app-hero-header", inputs: { profile: { classPropertyName: "profile", publicName: "profile", isSignal: true, isRequired: true, transformFunction: null }, age: { classPropertyName: "age", publicName: "age", isSignal: true, isRequired: true, transformFunction: null }, user: { classPropertyName: "user", publicName: "user", isSignal: true, isRequired: true, transformFunction: null }, weightLabel: { classPropertyName: "weightLabel", publicName: "weightLabel", isSignal: true, isRequired: false, transformFunction: null }, isAnyLoading: { classPropertyName: "isAnyLoading", publicName: "isAnyLoading", isSignal: true, isRequired: false, transformFunction: null }, showRefresh: { classPropertyName: "showRefresh", publicName: "showRefresh", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { refresh: "refresh", openMenu: "openMenu" }, ngImport: i0, template: "<div class=\"hero-header\">\n <!-- \u2500\u2500 ROW A: Identity \u2500\u2500 -->\n <div class=\"hero-header__identity\">\n <!-- Avatar -->\n <div class=\"hero-header__avatar\" aria-hidden=\"true\">\n {{ genderEmoji }}\n </div>\n\n <!-- Name + meta -->\n <div class=\"hero-header__info\">\n <div class=\"hero-header__name-row\">\n <h1 class=\"hero-header__name\">{{ profile().babyName }}</h1>\n <span class=\"hero-header__age-chip\">{{ ageChip }}</span>\n </div>\n <p class=\"hero-header__meta\">\n <span>{{ age().weeks }} tu\u1EA7n</span>\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span>{{ profile().birthDate | date: 'dd/MM/yyyy' }}</span>\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span>{{ user() }}</span>\n @if (weightLabel()) {\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span class=\"hero-header__weight\">\n <i class=\"pi pi-heart-fill\" aria-hidden=\"true\"></i>\n {{ weightLabel() }}\n </span>\n }\n </p>\n </div>\n\n <!-- Actions -->\n <div class=\"hero-header__actions\">\n <!-- Activity log is projected via ng-content -->\n <ng-content select=\"[slot=activity-log]\"></ng-content>\n\n @if (showRefresh()) {\n <button\n type=\"button\"\n class=\"hero-header__icon-btn\"\n (click)=\"refresh.emit()\"\n [disabled]=\"isAnyLoading()\"\n [title]=\"isAnyLoading() ? '\u0110ang t\u1EA3i\u2026' : 'T\u1EA3i l\u1EA1i'\"\n aria-label=\"T\u1EA3i l\u1EA1i d\u1EEF li\u1EC7u\"\n >\n <i class=\"pi pi-refresh\" [class.spin]=\"isAnyLoading()\" aria-hidden=\"true\"></i>\n </button>\n }\n\n <!-- Float menu trigger (hamburger) -->\n <button\n type=\"button\"\n class=\"hero-header__icon-btn\"\n (click)=\"openMenu.emit()\"\n title=\"Menu\"\n aria-label=\"Menu\"\n >\n <i class=\"pi pi-bars\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n</div>\n", styles: [".hero-header{padding:12px 16px 10px}.hero-header__identity{display:flex;align-items:center;gap:10px}.hero-header__avatar{width:44px;height:44px;border-radius:14px;background:var(--primary);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;border:2px solid rgba(91,108,255,.25)}.hero-header__info{flex:1;min-width:0}.hero-header__name-row{display:flex;align-items:center;gap:7px;margin-bottom:3px}.hero-header__name{font-size:18px;font-weight:700;color:var(--text);letter-spacing:-.3px;white-space:nowrap;margin:0;line-height:1.2}.hero-header__age-chip{padding:2px 8px;border-radius:20px;background:var(--primary);color:#fff;font-size:11px;font-weight:600;white-space:nowrap;flex-shrink:0}.hero-header__meta{display:flex;gap:4px;align-items:center;overflow:hidden;white-space:nowrap;margin:0;font-size:10px;color:var(--muted)}.hero-header__dot{color:var(--muted-2);font-size:9px}.hero-header__weight{display:inline-flex;align-items:center;gap:3px}.hero-header__weight .pi{font-size:9px;color:var(--accent)}.hero-header__actions{display:flex;gap:5px;align-items:center;flex-shrink:0}.hero-header__icon-btn{width:34px;height:34px;border-radius:10px;background:#5b6cff0f;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--muted);cursor:pointer;transition:background .15s,color .15s;list-style:none}.hero-header__icon-btn:hover:not([disabled]){background:#5b6cff1f;color:var(--primary)}.hero-header__icon-btn[disabled]{opacity:.45;cursor:not-allowed}.hero-header__icon-btn .spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.hero-header__menu{position:relative}.hero-header__menu-trigger::-webkit-details-marker{display:none}.hero-header__menu-panel{position:absolute;top:calc(100% + 6px);right:0;z-index:100;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:4px;min-width:190px;box-shadow:0 4px 16px #0f172a1f}.hero-header__menu-item{display:flex;align-items:center;gap:9px;width:100%;padding:9px 11px;border-radius:8px;font-size:13px;font-weight:500;color:var(--text);background:transparent;border:none;cursor:pointer;text-align:left;transition:background .12s}.hero-header__menu-item .pi{font-size:14px;color:var(--muted);width:16px;text-align:center}.hero-header__menu-item:hover{background:var(--primary-soft);color:var(--primary)}.hero-header__menu-item:hover .pi{color:var(--primary)}.hero-header__menu-item--danger,.hero-header__menu-item--danger .pi{color:var(--rose)}.hero-header__menu-item--danger:hover{background:var(--rose-soft);color:var(--rose)}.hero-header__menu-divider{border:none;border-top:1px solid var(--border);margin:3px 8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14560
14558
|
}
|
|
14561
14559
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: HeroHeaderComponent, decorators: [{
|
|
14562
14560
|
type: Component,
|
|
14563
|
-
args: [{ selector: 'app-hero-header', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"hero-header\">\n <!-- \u2500\u2500 ROW A: Identity \u2500\u2500 -->\n <div class=\"hero-header__identity\">\n <!-- Avatar -->\n <div class=\"hero-header__avatar\" aria-hidden=\"true\">\n {{ genderEmoji }}\n </div>\n\n <!-- Name + meta -->\n <div class=\"hero-header__info\">\n <div class=\"hero-header__name-row\">\n <h1 class=\"hero-header__name\">{{ profile().babyName }}</h1>\n <span class=\"hero-header__age-chip\">{{ ageChip }}</span>\n </div>\n <p class=\"hero-header__meta\">\n <span>{{ age().weeks }} tu\u1EA7n</span>\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span>{{ profile().birthDate | date: 'dd/MM/yyyy' }}</span>\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span>{{ user() }}</span>\n @if (weightLabel()) {\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span class=\"hero-header__weight\">\n <i class=\"pi pi-heart-fill\" aria-hidden=\"true\"></i>\n {{ weightLabel() }}\n </span>\n }\n </p>\n </div>\n\n <!-- Actions -->\n <div class=\"hero-header__actions\">\n <!-- Activity log is projected via ng-content -->\n <ng-content select=\"[slot=activity-log]\"></ng-content>\n\n @if (showRefresh()) {\n <button\n type=\"button\"\n class=\"hero-header__icon-btn\"\n (click)=\"refresh.emit()\"\n [disabled]=\"isAnyLoading()\"\n [title]=\"isAnyLoading() ? '\u0110ang t\u1EA3i\u2026' : 'T\u1EA3i l\u1EA1i'\"\n aria-label=\"T\u1EA3i l\u1EA1i d\u1EEF li\u1EC7u\"\n >\n <i class=\"pi pi-refresh\" [class.spin]=\"isAnyLoading()\" aria-hidden=\"true\"></i>\n </button>\n }\n\n <!--
|
|
14564
|
-
}], propDecorators: { profile: [{ type: i0.Input, args: [{ isSignal: true, alias: "profile", required: true }] }], age: [{ type: i0.Input, args: [{ isSignal: true, alias: "age", required: true }] }], user: [{ type: i0.Input, args: [{ isSignal: true, alias: "user", required: true }] }], weightLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "weightLabel", required: false }] }], isAnyLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isAnyLoading", required: false }] }], showRefresh: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRefresh", required: false }] }],
|
|
14561
|
+
args: [{ selector: 'app-hero-header', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"hero-header\">\n <!-- \u2500\u2500 ROW A: Identity \u2500\u2500 -->\n <div class=\"hero-header__identity\">\n <!-- Avatar -->\n <div class=\"hero-header__avatar\" aria-hidden=\"true\">\n {{ genderEmoji }}\n </div>\n\n <!-- Name + meta -->\n <div class=\"hero-header__info\">\n <div class=\"hero-header__name-row\">\n <h1 class=\"hero-header__name\">{{ profile().babyName }}</h1>\n <span class=\"hero-header__age-chip\">{{ ageChip }}</span>\n </div>\n <p class=\"hero-header__meta\">\n <span>{{ age().weeks }} tu\u1EA7n</span>\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span>{{ profile().birthDate | date: 'dd/MM/yyyy' }}</span>\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span>{{ user() }}</span>\n @if (weightLabel()) {\n <span class=\"hero-header__dot\" aria-hidden=\"true\">\u00B7</span>\n <span class=\"hero-header__weight\">\n <i class=\"pi pi-heart-fill\" aria-hidden=\"true\"></i>\n {{ weightLabel() }}\n </span>\n }\n </p>\n </div>\n\n <!-- Actions -->\n <div class=\"hero-header__actions\">\n <!-- Activity log is projected via ng-content -->\n <ng-content select=\"[slot=activity-log]\"></ng-content>\n\n @if (showRefresh()) {\n <button\n type=\"button\"\n class=\"hero-header__icon-btn\"\n (click)=\"refresh.emit()\"\n [disabled]=\"isAnyLoading()\"\n [title]=\"isAnyLoading() ? '\u0110ang t\u1EA3i\u2026' : 'T\u1EA3i l\u1EA1i'\"\n aria-label=\"T\u1EA3i l\u1EA1i d\u1EEF li\u1EC7u\"\n >\n <i class=\"pi pi-refresh\" [class.spin]=\"isAnyLoading()\" aria-hidden=\"true\"></i>\n </button>\n }\n\n <!-- Float menu trigger (hamburger) -->\n <button\n type=\"button\"\n class=\"hero-header__icon-btn\"\n (click)=\"openMenu.emit()\"\n title=\"Menu\"\n aria-label=\"Menu\"\n >\n <i class=\"pi pi-bars\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n</div>\n", styles: [".hero-header{padding:12px 16px 10px}.hero-header__identity{display:flex;align-items:center;gap:10px}.hero-header__avatar{width:44px;height:44px;border-radius:14px;background:var(--primary);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;border:2px solid rgba(91,108,255,.25)}.hero-header__info{flex:1;min-width:0}.hero-header__name-row{display:flex;align-items:center;gap:7px;margin-bottom:3px}.hero-header__name{font-size:18px;font-weight:700;color:var(--text);letter-spacing:-.3px;white-space:nowrap;margin:0;line-height:1.2}.hero-header__age-chip{padding:2px 8px;border-radius:20px;background:var(--primary);color:#fff;font-size:11px;font-weight:600;white-space:nowrap;flex-shrink:0}.hero-header__meta{display:flex;gap:4px;align-items:center;overflow:hidden;white-space:nowrap;margin:0;font-size:10px;color:var(--muted)}.hero-header__dot{color:var(--muted-2);font-size:9px}.hero-header__weight{display:inline-flex;align-items:center;gap:3px}.hero-header__weight .pi{font-size:9px;color:var(--accent)}.hero-header__actions{display:flex;gap:5px;align-items:center;flex-shrink:0}.hero-header__icon-btn{width:34px;height:34px;border-radius:10px;background:#5b6cff0f;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--muted);cursor:pointer;transition:background .15s,color .15s;list-style:none}.hero-header__icon-btn:hover:not([disabled]){background:#5b6cff1f;color:var(--primary)}.hero-header__icon-btn[disabled]{opacity:.45;cursor:not-allowed}.hero-header__icon-btn .spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.hero-header__menu{position:relative}.hero-header__menu-trigger::-webkit-details-marker{display:none}.hero-header__menu-panel{position:absolute;top:calc(100% + 6px);right:0;z-index:100;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:4px;min-width:190px;box-shadow:0 4px 16px #0f172a1f}.hero-header__menu-item{display:flex;align-items:center;gap:9px;width:100%;padding:9px 11px;border-radius:8px;font-size:13px;font-weight:500;color:var(--text);background:transparent;border:none;cursor:pointer;text-align:left;transition:background .12s}.hero-header__menu-item .pi{font-size:14px;color:var(--muted);width:16px;text-align:center}.hero-header__menu-item:hover{background:var(--primary-soft);color:var(--primary)}.hero-header__menu-item:hover .pi{color:var(--primary)}.hero-header__menu-item--danger,.hero-header__menu-item--danger .pi{color:var(--rose)}.hero-header__menu-item--danger:hover{background:var(--rose-soft);color:var(--rose)}.hero-header__menu-divider{border:none;border-top:1px solid var(--border);margin:3px 8px}\n"] }]
|
|
14562
|
+
}], propDecorators: { profile: [{ type: i0.Input, args: [{ isSignal: true, alias: "profile", required: true }] }], age: [{ type: i0.Input, args: [{ isSignal: true, alias: "age", required: true }] }], user: [{ type: i0.Input, args: [{ isSignal: true, alias: "user", required: true }] }], weightLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "weightLabel", required: false }] }], isAnyLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isAnyLoading", required: false }] }], showRefresh: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRefresh", required: false }] }], refresh: [{ type: i0.Output, args: ["refresh"] }], openMenu: [{ type: i0.Output, args: ["openMenu"] }] } });
|
|
14565
14563
|
|
|
14566
14564
|
class HeroStatsStripComponent {
|
|
14567
14565
|
constructor() {
|
|
@@ -14638,6 +14636,202 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
|
|
|
14638
14636
|
args: [{ selector: 'app-notification-banner', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- \u2500\u2500 Banner row (always visible, click opens dialog managed by parent) \u2500\u2500 -->\n<button\n type=\"button\"\n class=\"notif-banner\"\n (click)=\"openDialog.emit()\"\n aria-label=\"M\u1EDF danh s\u00E1ch th\u00F4ng b\u00E1o\"\n>\n <i class=\"pi pi-megaphone notif-banner__icon\" aria-hidden=\"true\"></i>\n <span class=\"notif-banner__text\">\n @if (unreadCount > 0) {\n <strong>B\u1EA1n c\u00F3 {{ unreadCount }} th\u00F4ng b\u00E1o m\u1EDBi</strong>\n } @else {\n <span class=\"notif-banner__empty\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n }\n </span>\n @if (unreadCount > 0) {\n <span class=\"notif-banner__badge\" aria-label=\"{{ unreadCount }} ch\u01B0a \u0111\u1ECDc\">\n {{ unreadCount > 9 ? '9+' : unreadCount }}\n </span>\n }\n <i class=\"pi pi-chevron-right notif-banner__chevron\" aria-hidden=\"true\"></i>\n</button>\n\n<!-- \u2500\u2500 Bottom sheet dialog (rendered here but parent controls open state) \u2500\u2500 -->\n@if (dialogOpen()) {\n <div\n class=\"notif-dialog-overlay\"\n (click)=\"closeDialog.emit()\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"Th\u00F4ng b\u00E1o\"\n >\n <div class=\"notif-dialog\" (click)=\"$event.stopPropagation()\">\n <!-- Handle -->\n <div class=\"notif-dialog__handle\" aria-hidden=\"true\"></div>\n\n <!-- Header -->\n <div class=\"notif-dialog__header\">\n <div class=\"notif-dialog__header-info\">\n <div class=\"notif-dialog__header-icon\" aria-hidden=\"true\">\n <i class=\"pi pi-megaphone\"></i>\n </div>\n <div>\n <h2 class=\"notif-dialog__title\">Th\u00F4ng b\u00E1o</h2>\n <p class=\"notif-dialog__subtitle\">{{ unreadCount }} ch\u01B0a \u0111\u1ECDc</p>\n </div>\n </div>\n <div class=\"notif-dialog__header-actions\">\n <button\n type=\"button\"\n class=\"notif-dialog__action-btn\"\n (click)=\"acknowledgeAll.emit()\"\n [disabled]=\"saving() || unreadCount === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n \u0110\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button\n type=\"button\"\n class=\"notif-dialog__add-btn\"\n (click)=\"openComposer.emit()\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n title=\"T\u1EA1o th\u00F4ng b\u00E1o m\u1EDBi\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n <button\n type=\"button\"\n class=\"notif-dialog__close-btn\"\n (click)=\"closeDialog.emit()\"\n aria-label=\"\u0110\u00F3ng\"\n >\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n\n <!-- List -->\n <div class=\"notif-dialog__list-wrap\">\n @if (notifications().length === 0) {\n <div class=\"notif-dialog__empty\">\n <i class=\"pi pi-inbox\" aria-hidden=\"true\"></i>\n <p>Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</p>\n </div>\n }\n @for (notice of notifications(); track notice) {\n <div class=\"notif-dialog__item\">\n <div class=\"notif-dialog__avatar\" aria-hidden=\"true\">\n {{ notice.user | slice: 0 : 2 | uppercase }}\n </div>\n <div class=\"notif-dialog__body\">\n <div class=\"notif-dialog__body-head\">\n <span class=\"notif-dialog__author\">{{ notice.user }}</span>\n @if (notice.createdAt) {\n <span class=\"notif-dialog__time\">{{ formatCreatedAt(notice.createdAt) }}</span>\n }\n </div>\n <p class=\"notif-dialog__message\">{{ notice.content }}</p>\n </div>\n <div class=\"notif-dialog__item-actions\">\n <button\n type=\"button\"\n class=\"notif-dialog__ack-btn\"\n (click)=\"acknowledge.emit(notice)\"\n [disabled]=\"saving()\"\n aria-label=\"\u0110\u00E1nh d\u1EA5u \u0111\u00E3 \u0111\u1ECDc\"\n title=\"\u0110\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDelete(notice)) {\n <button\n type=\"button\"\n class=\"notif-dialog__delete-btn\"\n (click)=\"delete.emit(notice)\"\n [disabled]=\"saving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\"\n title=\"X\u00F3a\"\n >\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n}\n", styles: [".notif-banner{display:flex;align-items:center;gap:8px;width:100%;padding:9px 14px;background:var(--surface);border:1px solid var(--border);border-radius:12px;cursor:pointer;text-align:left;transition:background .15s}.notif-banner:hover{background:var(--primary-soft)}.notif-banner__icon{font-size:14px;color:var(--muted);flex-shrink:0}.notif-banner__text{flex:1;font-size:12px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.notif-banner__empty{color:var(--muted)}.notif-banner__badge{background:#ef4444;color:#fff;border-radius:20px;min-width:18px;height:18px;font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;flex-shrink:0}.notif-banner__chevron{font-size:11px;color:var(--muted-2);flex-shrink:0}.notif-dialog-overlay{position:fixed;inset:0;background:#0f172a80;z-index:300;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:calc(62px + env(safe-area-inset-bottom,0px))}.notif-dialog{background:var(--surface);border-radius:20px 20px 0 0;border-top:1px solid var(--border);max-height:80vh;display:flex;flex-direction:column;overflow:hidden;border-bottom:1px solid var(--border)}.notif-dialog__handle{width:36px;height:4px;border-radius:2px;background:var(--border-strong);margin:10px auto 4px;flex-shrink:0}.notif-dialog__header{display:flex;align-items:center;justify-content:space-between;padding:4px 16px 10px;border-bottom:1px solid var(--border);flex-shrink:0;gap:10px}.notif-dialog__header-info{display:flex;align-items:center;gap:10px}.notif-dialog__header-icon{width:32px;height:32px;border-radius:9px;background:var(--primary-soft);display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--primary)}.notif-dialog__title{font-size:14px;font-weight:700;color:var(--text);margin:0}.notif-dialog__subtitle{font-size:10px;color:var(--muted);margin:0}.notif-dialog__header-actions{display:flex;gap:6px;align-items:center}.notif-dialog__action-btn{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:8px;font-size:11px;font-weight:500;color:var(--muted);background:var(--primary-soft);border:none;cursor:pointer;white-space:nowrap;transition:background .12s,color .12s}.notif-dialog__action-btn:hover:not([disabled]){background:#5b6cff26;color:var(--primary)}.notif-dialog__action-btn[disabled]{opacity:.4;cursor:not-allowed}.notif-dialog__add-btn,.notif-dialog__close-btn{width:28px;height:28px;border-radius:8px;background:#5b6cff0f;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--muted);cursor:pointer;transition:background .12s,color .12s}.notif-dialog__add-btn:hover,.notif-dialog__close-btn:hover{background:var(--primary-soft);color:var(--primary)}.notif-dialog__list-wrap{overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1}.notif-dialog__empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:32px 16px;color:var(--muted-2);font-size:13px}.notif-dialog__empty .pi{font-size:28px}.notif-dialog__item{display:flex;gap:10px;padding:10px 16px;align-items:flex-start;border-top:1px solid var(--border);transition:background .12s}.notif-dialog__item:first-child{border-top:none}.notif-dialog__item:hover{background:#f6f7fbcc}.notif-dialog__avatar{width:30px;height:30px;border-radius:50%;background:var(--primary-soft);border:1px solid rgba(91,108,255,.2);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:var(--primary);flex-shrink:0}.notif-dialog__body{flex:1;min-width:0}.notif-dialog__body-head{display:flex;align-items:baseline;gap:6px;margin-bottom:3px}.notif-dialog__author{font-size:12px;font-weight:600;color:var(--text)}.notif-dialog__time{font-size:10px;color:var(--muted-2)}.notif-dialog__message{font-size:11px;color:var(--muted);margin:0;line-height:1.4}.notif-dialog__item-actions{display:flex;gap:4px;flex-shrink:0}.notif-dialog__ack-btn,.notif-dialog__delete-btn{width:24px;height:24px;border-radius:6px;background:transparent;border:none;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--muted-2);cursor:pointer;transition:background .12s,color .12s}.notif-dialog__ack-btn:hover:not([disabled]),.notif-dialog__delete-btn:hover:not([disabled]){background:var(--rose-soft);color:var(--rose)}.notif-dialog__ack-btn[disabled],.notif-dialog__delete-btn[disabled]{opacity:.35;cursor:not-allowed}\n"] }]
|
|
14639
14637
|
}], propDecorators: { notifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "notifications", required: true }] }], saving: [{ type: i0.Input, args: [{ isSignal: true, alias: "saving", required: false }] }], currentUser: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentUser", required: true }] }], dialogOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "dialogOpen", required: false }] }], openDialog: [{ type: i0.Output, args: ["openDialog"] }], closeDialog: [{ type: i0.Output, args: ["closeDialog"] }], acknowledge: [{ type: i0.Output, args: ["acknowledge"] }], acknowledgeAll: [{ type: i0.Output, args: ["acknowledgeAll"] }], delete: [{ type: i0.Output, args: ["delete"] }], openComposer: [{ type: i0.Output, args: ["openComposer"] }] } });
|
|
14640
14638
|
|
|
14639
|
+
class NotificationListComponent {
|
|
14640
|
+
constructor() {
|
|
14641
|
+
/** Toàn bộ thông báo (cả đã đọc lẫn chưa đọc) từ NotificationLogService. */
|
|
14642
|
+
this.notifications = input.required(...(ngDevMode ? [{ debugName: "notifications" }] : /* istanbul ignore next */ []));
|
|
14643
|
+
this.currentUser = input.required(...(ngDevMode ? [{ debugName: "currentUser" }] : /* istanbul ignore next */ []));
|
|
14644
|
+
this.saving = input(false, ...(ngDevMode ? [{ debugName: "saving" }] : /* istanbul ignore next */ []));
|
|
14645
|
+
this.back = output();
|
|
14646
|
+
this.acknowledge = output();
|
|
14647
|
+
this.acknowledgeAll = output();
|
|
14648
|
+
this.delete = output();
|
|
14649
|
+
this.openComposer = output();
|
|
14650
|
+
this.filter = signal('all', ...(ngDevMode ? [{ debugName: "filter" }] : /* istanbul ignore next */ []));
|
|
14651
|
+
this.selectedRow = signal(null, ...(ngDevMode ? [{ debugName: "selectedRow" }] : /* istanbul ignore next */ []));
|
|
14652
|
+
this.counts = computed(() => {
|
|
14653
|
+
const all = this.notifications();
|
|
14654
|
+
const u = this.normalizedUser();
|
|
14655
|
+
const unread = u
|
|
14656
|
+
? all.filter((n) => !n.acknowledgeUsers.includes(u)).length
|
|
14657
|
+
: 0;
|
|
14658
|
+
return { all: all.length, unread, read: all.length - unread };
|
|
14659
|
+
}, ...(ngDevMode ? [{ debugName: "counts" }] : /* istanbul ignore next */ []));
|
|
14660
|
+
this.filtered = computed(() => {
|
|
14661
|
+
const f = this.filter();
|
|
14662
|
+
if (f === 'all')
|
|
14663
|
+
return this.notifications();
|
|
14664
|
+
return this.notifications().filter((n) => f === 'unread' ? !this.isRead(n) : this.isRead(n));
|
|
14665
|
+
}, ...(ngDevMode ? [{ debugName: "filtered" }] : /* istanbul ignore next */ []));
|
|
14666
|
+
this.groups = computed(() => {
|
|
14667
|
+
const order = ['Hôm nay', 'Hôm qua', 'Tuần này', 'Cũ hơn'];
|
|
14668
|
+
const buckets = new Map();
|
|
14669
|
+
for (const g of order)
|
|
14670
|
+
buckets.set(g, []);
|
|
14671
|
+
for (const n of this.filtered()) {
|
|
14672
|
+
buckets.get(this.dateGroup(n.createdAt))?.push(n);
|
|
14673
|
+
}
|
|
14674
|
+
return order
|
|
14675
|
+
.map((g) => ({ group: g, items: buckets.get(g) ?? [] }))
|
|
14676
|
+
.filter((b) => b.items.length > 0);
|
|
14677
|
+
}, ...(ngDevMode ? [{ debugName: "groups" }] : /* istanbul ignore next */ []));
|
|
14678
|
+
}
|
|
14679
|
+
normalizedUser() {
|
|
14680
|
+
return this.currentUser().trim().toLowerCase();
|
|
14681
|
+
}
|
|
14682
|
+
isRead(item) {
|
|
14683
|
+
const u = this.normalizedUser();
|
|
14684
|
+
return u ? item.acknowledgeUsers.includes(u) : false;
|
|
14685
|
+
}
|
|
14686
|
+
canDelete(item) {
|
|
14687
|
+
return item.user === (this.normalizedUser() || 'guest');
|
|
14688
|
+
}
|
|
14689
|
+
setFilter(f) {
|
|
14690
|
+
this.filter.set(f);
|
|
14691
|
+
this.selectedRow.set(null);
|
|
14692
|
+
}
|
|
14693
|
+
toggleSelected(item) {
|
|
14694
|
+
if (this.saving())
|
|
14695
|
+
return;
|
|
14696
|
+
const key = item.rowIndex ?? -1;
|
|
14697
|
+
this.selectedRow.update((cur) => (cur === key ? null : key));
|
|
14698
|
+
}
|
|
14699
|
+
isSelected(item) {
|
|
14700
|
+
return this.selectedRow() === (item.rowIndex ?? -1);
|
|
14701
|
+
}
|
|
14702
|
+
onAcknowledge(item, ev) {
|
|
14703
|
+
ev.stopPropagation();
|
|
14704
|
+
if (this.saving())
|
|
14705
|
+
return;
|
|
14706
|
+
this.acknowledge.emit(item);
|
|
14707
|
+
}
|
|
14708
|
+
onDelete(item, ev) {
|
|
14709
|
+
ev.stopPropagation();
|
|
14710
|
+
if (this.saving() || !this.canDelete(item))
|
|
14711
|
+
return;
|
|
14712
|
+
this.delete.emit(item);
|
|
14713
|
+
}
|
|
14714
|
+
onAcknowledgeAll(ev) {
|
|
14715
|
+
ev.stopPropagation();
|
|
14716
|
+
if (this.saving() || this.counts().unread === 0)
|
|
14717
|
+
return;
|
|
14718
|
+
this.acknowledgeAll.emit();
|
|
14719
|
+
}
|
|
14720
|
+
onCompose(ev) {
|
|
14721
|
+
ev.stopPropagation();
|
|
14722
|
+
if (this.saving())
|
|
14723
|
+
return;
|
|
14724
|
+
this.openComposer.emit();
|
|
14725
|
+
}
|
|
14726
|
+
onBack() {
|
|
14727
|
+
if (this.saving())
|
|
14728
|
+
return;
|
|
14729
|
+
this.back.emit();
|
|
14730
|
+
}
|
|
14731
|
+
/** Đóng gói theo khoảng thời gian kể từ createdAt. */
|
|
14732
|
+
dateGroup(createdAt) {
|
|
14733
|
+
if (!createdAt)
|
|
14734
|
+
return 'Cũ hơn';
|
|
14735
|
+
const d = new Date(createdAt);
|
|
14736
|
+
if (isNaN(d.getTime()))
|
|
14737
|
+
return 'Cũ hơn';
|
|
14738
|
+
const now = new Date();
|
|
14739
|
+
const startToday = new Date(now.getFullYear(), now.getMonth(), now.getDate()).getTime();
|
|
14740
|
+
const t = d.getTime();
|
|
14741
|
+
const day = 86_400_000;
|
|
14742
|
+
if (t >= startToday)
|
|
14743
|
+
return 'Hôm nay';
|
|
14744
|
+
if (t >= startToday - day)
|
|
14745
|
+
return 'Hôm qua';
|
|
14746
|
+
if (t >= startToday - 7 * day)
|
|
14747
|
+
return 'Tuần này';
|
|
14748
|
+
return 'Cũ hơn';
|
|
14749
|
+
}
|
|
14750
|
+
formatCreatedAt(createdAt) {
|
|
14751
|
+
if (!createdAt)
|
|
14752
|
+
return '';
|
|
14753
|
+
const d = new Date(createdAt);
|
|
14754
|
+
if (isNaN(d.getTime()))
|
|
14755
|
+
return createdAt;
|
|
14756
|
+
const now = new Date();
|
|
14757
|
+
const diffMs = now.getTime() - d.getTime();
|
|
14758
|
+
const diffMin = Math.floor(diffMs / 60_000);
|
|
14759
|
+
const diffHr = Math.floor(diffMs / 3_600_000);
|
|
14760
|
+
const diffDay = Math.floor(diffMs / 86_400_000);
|
|
14761
|
+
if (diffMin < 1)
|
|
14762
|
+
return 'vừa xong';
|
|
14763
|
+
if (diffMin < 60)
|
|
14764
|
+
return `${diffMin} phút trước`;
|
|
14765
|
+
if (diffHr < 24)
|
|
14766
|
+
return `${diffHr} giờ trước`;
|
|
14767
|
+
if (diffDay === 1)
|
|
14768
|
+
return 'hôm qua';
|
|
14769
|
+
if (diffDay < 7)
|
|
14770
|
+
return `${diffDay} ngày trước`;
|
|
14771
|
+
return d.toLocaleDateString('vi-VN', { day: '2-digit', month: '2-digit' });
|
|
14772
|
+
}
|
|
14773
|
+
/** Avatar name hiển thị: 2 chữ cái đầu của tên tác giả (đã normalise). */
|
|
14774
|
+
initials(user) {
|
|
14775
|
+
const raw = user || '?';
|
|
14776
|
+
const parts = raw.split(/\s+/).filter(Boolean);
|
|
14777
|
+
if (parts.length === 0)
|
|
14778
|
+
return '?';
|
|
14779
|
+
if (parts.length === 1)
|
|
14780
|
+
return parts[0].slice(0, 2).toUpperCase();
|
|
14781
|
+
return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
|
|
14782
|
+
}
|
|
14783
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: NotificationListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14784
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: NotificationListComponent, isStandalone: true, selector: "app-notification-list", inputs: { notifications: { classPropertyName: "notifications", publicName: "notifications", isSignal: true, isRequired: true, transformFunction: null }, currentUser: { classPropertyName: "currentUser", publicName: "currentUser", isSignal: true, isRequired: true, transformFunction: null }, saving: { classPropertyName: "saving", publicName: "saving", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { back: "back", acknowledge: "acknowledge", acknowledgeAll: "acknowledgeAll", delete: "delete", openComposer: "openComposer" }, ngImport: i0, template: "<section class=\"notif-route\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Th\u00F4ng b\u00E1o\">\n <!-- \u2500\u2500 Header \u2500\u2500 -->\n <header class=\"nl-header\">\n <div class=\"nl-header__row\">\n <button\n type=\"button\"\n class=\"nl-icon-btn nl-back\"\n (click)=\"onBack()\"\n aria-label=\"Quay l\u1EA1i\"\n >\n <i class=\"pi pi-chevron-left\" aria-hidden=\"true\"></i>\n </button>\n\n <div class=\"nl-title-wrap\">\n <h1 class=\"nl-title\">Th\u00F4ng b\u00E1o</h1>\n @if (counts().unread > 0) {\n <span class=\"nl-unread-dot\" aria-hidden=\"true\"></span>\n }\n </div>\n\n <span class=\"nl-spacer\"></span>\n\n <button\n type=\"button\"\n class=\"nl-pill-btn nl-read-all\"\n (click)=\"onAcknowledgeAll($event)\"\n [disabled]=\"saving() || counts().unread === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-check-square\" aria-hidden=\"true\"></i>\n <span>\u0110\u1ECDc t\u1EA5t c\u1EA3</span>\n </button>\n\n <button\n type=\"button\"\n class=\"nl-icon-btn nl-compose\"\n (click)=\"onCompose($event)\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n title=\"T\u1EA1o th\u00F4ng b\u00E1o m\u1EDBi\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n </div>\n\n <!-- \u2500\u2500 Segmented filter \u2500\u2500 -->\n <div class=\"nl-segment\" role=\"tablist\" aria-label=\"L\u1ECDc th\u00F4ng b\u00E1o\">\n <button\n type=\"button\"\n role=\"tab\"\n class=\"nl-seg\"\n [class.active]=\"filter() === 'all'\"\n (click)=\"setFilter('all')\"\n >\n <span>T\u1EA5t c\u1EA3</span>\n <span class=\"nl-seg__count\">{{ counts().all }}</span>\n </button>\n <button\n type=\"button\"\n role=\"tab\"\n class=\"nl-seg\"\n [class.active]=\"filter() === 'unread'\"\n (click)=\"setFilter('unread')\"\n >\n <span>Ch\u01B0a \u0111\u1ECDc</span>\n <span class=\"nl-seg__count\">{{ counts().unread }}</span>\n </button>\n <button\n type=\"button\"\n role=\"tab\"\n class=\"nl-seg\"\n [class.active]=\"filter() === 'read'\"\n (click)=\"setFilter('read')\"\n >\n <span>\u0110\u00E3 \u0111\u1ECDc</span>\n <span class=\"nl-seg__count\">{{ counts().read }}</span>\n </button>\n </div>\n </header>\n\n <!-- \u2500\u2500 List (grouped by date) \u2500\u2500 -->\n <div class=\"nl-list\">\n @for (bucket of groups(); track bucket.group) {\n <section class=\"nl-group\">\n <div class=\"nl-group__head\">\n <span class=\"nl-group__label\">{{ bucket.group }}</span>\n <span class=\"nl-group__line\"></span>\n <span class=\"nl-group__count\">{{ bucket.items.length }}</span>\n </div>\n\n <div class=\"nl-group__items\">\n @for (item of bucket.items; track item.rowIndex ?? $index) {\n <article\n class=\"nl-item\"\n [class.is-unread]=\"!isRead(item)\"\n [class.is-selected]=\"isSelected(item)\"\n (click)=\"toggleSelected(item)\"\n >\n @if (!isRead(item)) {\n <span class=\"nl-item__bar\" aria-hidden=\"true\"></span>\n }\n\n <div class=\"nl-item__avatar\" aria-hidden=\"true\">\n {{ initials(item.user) }}\n </div>\n\n <div class=\"nl-item__body\">\n <div class=\"nl-item__head\">\n <span class=\"nl-item__author\">{{ item.user }}</span>\n @if (!isRead(item)) {\n <span class=\"nl-item__dot\" aria-hidden=\"true\"></span>\n }\n <span class=\"nl-item__time\">{{\n formatCreatedAt(item.createdAt)\n }}</span>\n </div>\n <p class=\"nl-item__content\">{{ item.content }}</p>\n\n @if (isSelected(item)) {\n <div class=\"nl-item__actions\">\n @if (!isRead(item)) {\n <button\n type=\"button\"\n class=\"nl-chip nl-chip--primary\"\n (click)=\"onAcknowledge(item, $event)\"\n [disabled]=\"saving()\"\n >\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n \u0110\u00E1nh d\u1EA5u \u0111\u00E3 \u0111\u1ECDc\n </button>\n }\n @if (canDelete(item)) {\n <button\n type=\"button\"\n class=\"nl-chip nl-chip--accent\"\n (click)=\"onDelete(item, $event)\"\n [disabled]=\"saving()\"\n >\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n Xo\u00E1\n </button>\n }\n </div>\n }\n </div>\n </article>\n }\n </div>\n </section>\n }\n\n @if (groups().length === 0) {\n <div class=\"nl-empty\">\n <i class=\"pi pi-inbox\" aria-hidden=\"true\"></i>\n <p>Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o trong m\u1EE5c n\u00E0y</p>\n </div>\n }\n </div>\n</section>\n", styles: ["@charset \"UTF-8\";:host{--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--border-strong: #d1d5db;--primary: #5b6cff;--primary-2: #4c5cf0;--primary-soft: #eef0ff;--accent: #ff5c8a;--accent-soft: #ffe7ef;--text: #0f172a;--muted: #475569;--muted-2: #94a3b8;--muted-3: #cbd5e1;position:fixed;inset:0;z-index:200;background:var(--bg);display:flex;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--text);animation:nl-slide-in .22s cubic-bezier(.22,1,.36,1)}@keyframes nl-slide-in{0%{transform:translate(8px);opacity:0}to{transform:translate(0);opacity:1}}.nl-header{flex-shrink:0;background:var(--surface);border-bottom:1px solid var(--border);padding-top:env(safe-area-inset-top,0px)}.nl-header__row{display:flex;align-items:center;gap:8px;padding:8px 12px 4px}.nl-icon-btn{display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;cursor:pointer;color:var(--muted);font-size:15px;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}.nl-icon-btn:disabled{opacity:.5;cursor:not-allowed}.nl-back{width:32px;height:32px;border-radius:9px}.nl-back:hover{background:var(--primary-soft);color:var(--primary)}.nl-title-wrap{display:flex;align-items:center;gap:6px;min-width:0}.nl-title{margin:0;font-size:17px;font-weight:700;line-height:1.1;color:var(--text)}.nl-unread-dot{width:7px;height:7px;border-radius:999px;background:var(--accent)}.nl-spacer{flex:1}.nl-pill-btn{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--primary);background:var(--primary-soft);border:none;border-radius:999px;padding:6px 10px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,opacity .15s}.nl-pill-btn i{font-size:12px}.nl-pill-btn:hover:not(:disabled){background:color-mix(in srgb,var(--primary-soft) 70%,var(--primary) 8%)}.nl-pill-btn:disabled{opacity:.5;cursor:not-allowed}.nl-compose{width:32px;height:32px;border-radius:999px;background:var(--accent);color:#fff;font-size:15px}.nl-compose:hover:not(:disabled){background:color-mix(in srgb,var(--accent) 88%,#000 12%)}.nl-segment{display:flex;gap:4px;margin:8px 12px 12px;padding:4px;border-radius:12px;background:var(--bg)}.nl-seg{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 4px;border:none;border-radius:9px;background:transparent;color:var(--muted);font-size:11.5px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .18s,color .18s}.nl-seg.active{background:var(--surface);color:var(--primary)}.nl-seg__count{min-width:16px;height:15px;padding:0 5px;border-radius:999px;background:var(--bg);color:var(--muted-2);font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.nl-seg.active .nl-seg__count{background:var(--primary-soft);color:var(--primary)}.nl-list{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;padding:10px 12px calc(96px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px}.nl-group{display:flex;flex-direction:column;gap:6px}.nl-group__head{display:flex;align-items:center;gap:8px;padding:0 4px}.nl-group__label{font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}.nl-group__line{flex:1;height:1px;background:var(--border)}.nl-group__count{font-size:10.5px;color:var(--muted-2)}.nl-group__items{display:flex;flex-direction:column;gap:6px}.nl-item{position:relative;display:flex;gap:10px;align-items:flex-start;padding:11px 12px 11px 15px;border-radius:14px;background:var(--surface);border:1px solid var(--border);cursor:pointer;transition:border-color .15s,background .15s;-webkit-tap-highlight-color:transparent}.nl-item.is-selected{border-color:var(--primary-soft);background:color-mix(in srgb,var(--primary-soft) 35%,var(--surface))}.nl-item__bar{position:absolute;left:5px;top:14px;bottom:14px;width:3px;border-radius:999px;background:var(--primary)}.nl-item__avatar{flex-shrink:0;width:36px;height:36px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center}.nl-item__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.nl-item__head{display:flex;align-items:center;gap:6px}.nl-item__author{font-size:12.5px;font-weight:700;color:var(--text)}.nl-item:not(.is-unread) .nl-item__author{font-weight:500}.nl-item__dot{width:6px;height:6px;border-radius:999px;background:var(--accent);flex-shrink:0}.nl-item__time{margin-left:auto;font-size:11px;color:var(--muted-2);white-space:nowrap}.nl-item__content{margin:0;font-size:12.5px;line-height:1.4;color:var(--muted)}.nl-item:not(.is-unread) .nl-item__content{color:var(--muted-2)}.nl-item__actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.nl-chip{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;border:none;border-radius:999px;padding:4px 9px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s}.nl-chip i{font-size:11px}.nl-chip:disabled{opacity:.5;cursor:not-allowed}.nl-chip--primary{color:var(--primary);background:var(--primary-soft)}.nl-chip--accent{color:var(--accent);background:var(--accent-soft)}.nl-empty{margin:auto;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted-3)}.nl-empty i{font-size:28px}.nl-empty p{margin:0;font-size:12px;color:var(--muted-2)}@media(max-width:480px){.nl-pill-btn span{display:none}.nl-pill-btn{padding:6px 8px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14785
|
+
}
|
|
14786
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: NotificationListComponent, decorators: [{
|
|
14787
|
+
type: Component,
|
|
14788
|
+
args: [{ selector: 'app-notification-list', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"notif-route\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Th\u00F4ng b\u00E1o\">\n <!-- \u2500\u2500 Header \u2500\u2500 -->\n <header class=\"nl-header\">\n <div class=\"nl-header__row\">\n <button\n type=\"button\"\n class=\"nl-icon-btn nl-back\"\n (click)=\"onBack()\"\n aria-label=\"Quay l\u1EA1i\"\n >\n <i class=\"pi pi-chevron-left\" aria-hidden=\"true\"></i>\n </button>\n\n <div class=\"nl-title-wrap\">\n <h1 class=\"nl-title\">Th\u00F4ng b\u00E1o</h1>\n @if (counts().unread > 0) {\n <span class=\"nl-unread-dot\" aria-hidden=\"true\"></span>\n }\n </div>\n\n <span class=\"nl-spacer\"></span>\n\n <button\n type=\"button\"\n class=\"nl-pill-btn nl-read-all\"\n (click)=\"onAcknowledgeAll($event)\"\n [disabled]=\"saving() || counts().unread === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-check-square\" aria-hidden=\"true\"></i>\n <span>\u0110\u1ECDc t\u1EA5t c\u1EA3</span>\n </button>\n\n <button\n type=\"button\"\n class=\"nl-icon-btn nl-compose\"\n (click)=\"onCompose($event)\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n title=\"T\u1EA1o th\u00F4ng b\u00E1o m\u1EDBi\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n </div>\n\n <!-- \u2500\u2500 Segmented filter \u2500\u2500 -->\n <div class=\"nl-segment\" role=\"tablist\" aria-label=\"L\u1ECDc th\u00F4ng b\u00E1o\">\n <button\n type=\"button\"\n role=\"tab\"\n class=\"nl-seg\"\n [class.active]=\"filter() === 'all'\"\n (click)=\"setFilter('all')\"\n >\n <span>T\u1EA5t c\u1EA3</span>\n <span class=\"nl-seg__count\">{{ counts().all }}</span>\n </button>\n <button\n type=\"button\"\n role=\"tab\"\n class=\"nl-seg\"\n [class.active]=\"filter() === 'unread'\"\n (click)=\"setFilter('unread')\"\n >\n <span>Ch\u01B0a \u0111\u1ECDc</span>\n <span class=\"nl-seg__count\">{{ counts().unread }}</span>\n </button>\n <button\n type=\"button\"\n role=\"tab\"\n class=\"nl-seg\"\n [class.active]=\"filter() === 'read'\"\n (click)=\"setFilter('read')\"\n >\n <span>\u0110\u00E3 \u0111\u1ECDc</span>\n <span class=\"nl-seg__count\">{{ counts().read }}</span>\n </button>\n </div>\n </header>\n\n <!-- \u2500\u2500 List (grouped by date) \u2500\u2500 -->\n <div class=\"nl-list\">\n @for (bucket of groups(); track bucket.group) {\n <section class=\"nl-group\">\n <div class=\"nl-group__head\">\n <span class=\"nl-group__label\">{{ bucket.group }}</span>\n <span class=\"nl-group__line\"></span>\n <span class=\"nl-group__count\">{{ bucket.items.length }}</span>\n </div>\n\n <div class=\"nl-group__items\">\n @for (item of bucket.items; track item.rowIndex ?? $index) {\n <article\n class=\"nl-item\"\n [class.is-unread]=\"!isRead(item)\"\n [class.is-selected]=\"isSelected(item)\"\n (click)=\"toggleSelected(item)\"\n >\n @if (!isRead(item)) {\n <span class=\"nl-item__bar\" aria-hidden=\"true\"></span>\n }\n\n <div class=\"nl-item__avatar\" aria-hidden=\"true\">\n {{ initials(item.user) }}\n </div>\n\n <div class=\"nl-item__body\">\n <div class=\"nl-item__head\">\n <span class=\"nl-item__author\">{{ item.user }}</span>\n @if (!isRead(item)) {\n <span class=\"nl-item__dot\" aria-hidden=\"true\"></span>\n }\n <span class=\"nl-item__time\">{{\n formatCreatedAt(item.createdAt)\n }}</span>\n </div>\n <p class=\"nl-item__content\">{{ item.content }}</p>\n\n @if (isSelected(item)) {\n <div class=\"nl-item__actions\">\n @if (!isRead(item)) {\n <button\n type=\"button\"\n class=\"nl-chip nl-chip--primary\"\n (click)=\"onAcknowledge(item, $event)\"\n [disabled]=\"saving()\"\n >\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n \u0110\u00E1nh d\u1EA5u \u0111\u00E3 \u0111\u1ECDc\n </button>\n }\n @if (canDelete(item)) {\n <button\n type=\"button\"\n class=\"nl-chip nl-chip--accent\"\n (click)=\"onDelete(item, $event)\"\n [disabled]=\"saving()\"\n >\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n Xo\u00E1\n </button>\n }\n </div>\n }\n </div>\n </article>\n }\n </div>\n </section>\n }\n\n @if (groups().length === 0) {\n <div class=\"nl-empty\">\n <i class=\"pi pi-inbox\" aria-hidden=\"true\"></i>\n <p>Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o trong m\u1EE5c n\u00E0y</p>\n </div>\n }\n </div>\n</section>\n", styles: ["@charset \"UTF-8\";:host{--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--border-strong: #d1d5db;--primary: #5b6cff;--primary-2: #4c5cf0;--primary-soft: #eef0ff;--accent: #ff5c8a;--accent-soft: #ffe7ef;--text: #0f172a;--muted: #475569;--muted-2: #94a3b8;--muted-3: #cbd5e1;position:fixed;inset:0;z-index:200;background:var(--bg);display:flex;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--text);animation:nl-slide-in .22s cubic-bezier(.22,1,.36,1)}@keyframes nl-slide-in{0%{transform:translate(8px);opacity:0}to{transform:translate(0);opacity:1}}.nl-header{flex-shrink:0;background:var(--surface);border-bottom:1px solid var(--border);padding-top:env(safe-area-inset-top,0px)}.nl-header__row{display:flex;align-items:center;gap:8px;padding:8px 12px 4px}.nl-icon-btn{display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;cursor:pointer;color:var(--muted);font-size:15px;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}.nl-icon-btn:disabled{opacity:.5;cursor:not-allowed}.nl-back{width:32px;height:32px;border-radius:9px}.nl-back:hover{background:var(--primary-soft);color:var(--primary)}.nl-title-wrap{display:flex;align-items:center;gap:6px;min-width:0}.nl-title{margin:0;font-size:17px;font-weight:700;line-height:1.1;color:var(--text)}.nl-unread-dot{width:7px;height:7px;border-radius:999px;background:var(--accent)}.nl-spacer{flex:1}.nl-pill-btn{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--primary);background:var(--primary-soft);border:none;border-radius:999px;padding:6px 10px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,opacity .15s}.nl-pill-btn i{font-size:12px}.nl-pill-btn:hover:not(:disabled){background:color-mix(in srgb,var(--primary-soft) 70%,var(--primary) 8%)}.nl-pill-btn:disabled{opacity:.5;cursor:not-allowed}.nl-compose{width:32px;height:32px;border-radius:999px;background:var(--accent);color:#fff;font-size:15px}.nl-compose:hover:not(:disabled){background:color-mix(in srgb,var(--accent) 88%,#000 12%)}.nl-segment{display:flex;gap:4px;margin:8px 12px 12px;padding:4px;border-radius:12px;background:var(--bg)}.nl-seg{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 4px;border:none;border-radius:9px;background:transparent;color:var(--muted);font-size:11.5px;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .18s,color .18s}.nl-seg.active{background:var(--surface);color:var(--primary)}.nl-seg__count{min-width:16px;height:15px;padding:0 5px;border-radius:999px;background:var(--bg);color:var(--muted-2);font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.nl-seg.active .nl-seg__count{background:var(--primary-soft);color:var(--primary)}.nl-list{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;padding:10px 12px calc(96px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px}.nl-group{display:flex;flex-direction:column;gap:6px}.nl-group__head{display:flex;align-items:center;gap:8px;padding:0 4px}.nl-group__label{font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--muted)}.nl-group__line{flex:1;height:1px;background:var(--border)}.nl-group__count{font-size:10.5px;color:var(--muted-2)}.nl-group__items{display:flex;flex-direction:column;gap:6px}.nl-item{position:relative;display:flex;gap:10px;align-items:flex-start;padding:11px 12px 11px 15px;border-radius:14px;background:var(--surface);border:1px solid var(--border);cursor:pointer;transition:border-color .15s,background .15s;-webkit-tap-highlight-color:transparent}.nl-item.is-selected{border-color:var(--primary-soft);background:color-mix(in srgb,var(--primary-soft) 35%,var(--surface))}.nl-item__bar{position:absolute;left:5px;top:14px;bottom:14px;width:3px;border-radius:999px;background:var(--primary)}.nl-item__avatar{flex-shrink:0;width:36px;height:36px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center}.nl-item__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.nl-item__head{display:flex;align-items:center;gap:6px}.nl-item__author{font-size:12.5px;font-weight:700;color:var(--text)}.nl-item:not(.is-unread) .nl-item__author{font-weight:500}.nl-item__dot{width:6px;height:6px;border-radius:999px;background:var(--accent);flex-shrink:0}.nl-item__time{margin-left:auto;font-size:11px;color:var(--muted-2);white-space:nowrap}.nl-item__content{margin:0;font-size:12.5px;line-height:1.4;color:var(--muted)}.nl-item:not(.is-unread) .nl-item__content{color:var(--muted-2)}.nl-item__actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.nl-chip{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;border:none;border-radius:999px;padding:4px 9px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s}.nl-chip i{font-size:11px}.nl-chip:disabled{opacity:.5;cursor:not-allowed}.nl-chip--primary{color:var(--primary);background:var(--primary-soft)}.nl-chip--accent{color:var(--accent);background:var(--accent-soft)}.nl-empty{margin:auto;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted-3)}.nl-empty i{font-size:28px}.nl-empty p{margin:0;font-size:12px;color:var(--muted-2)}@media(max-width:480px){.nl-pill-btn span{display:none}.nl-pill-btn{padding:6px 8px}}\n"] }]
|
|
14789
|
+
}], propDecorators: { notifications: [{ type: i0.Input, args: [{ isSignal: true, alias: "notifications", required: true }] }], currentUser: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentUser", required: true }] }], saving: [{ type: i0.Input, args: [{ isSignal: true, alias: "saving", required: false }] }], back: [{ type: i0.Output, args: ["back"] }], acknowledge: [{ type: i0.Output, args: ["acknowledge"] }], acknowledgeAll: [{ type: i0.Output, args: ["acknowledgeAll"] }], delete: [{ type: i0.Output, args: ["delete"] }], openComposer: [{ type: i0.Output, args: ["openComposer"] }] } });
|
|
14790
|
+
|
|
14791
|
+
/**
|
|
14792
|
+
* Lớp vỏ subroute full-screen: header dính với nút back + tiêu đề,
|
|
14793
|
+
* phần nội dung được projection qua `<ng-content>`. Dùng cho Mẹ, Tài liệu…
|
|
14794
|
+
*/
|
|
14795
|
+
class SubrouteShellComponent {
|
|
14796
|
+
constructor() {
|
|
14797
|
+
this.title = input('', ...(ngDevMode ? [{ debugName: "title" }] : /* istanbul ignore next */ []));
|
|
14798
|
+
this.back = output();
|
|
14799
|
+
}
|
|
14800
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SubrouteShellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14801
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.17", type: SubrouteShellComponent, isStandalone: true, selector: "app-subroute-shell", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { back: "back" }, ngImport: i0, template: "<section class=\"subroute\" role=\"dialog\" aria-modal=\"true\" [attr.aria-label]=\"title()\">\n <header class=\"sr-header\">\n <button\n type=\"button\"\n class=\"sr-back\"\n (click)=\"back.emit()\"\n aria-label=\"Quay l\u1EA1i\"\n >\n <i class=\"pi pi-chevron-left\" aria-hidden=\"true\"></i>\n </button>\n <h1 class=\"sr-title\">{{ title() }}</h1>\n <span class=\"sr-spacer\"></span>\n <ng-content select=\"[slot=trailing]\"></ng-content>\n </header>\n <div class=\"sr-body\">\n <ng-content></ng-content>\n </div>\n</section>\n", styles: [":host{--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--primary: #5b6cff;--primary-soft: #eef0ff;--text: #0f172a;--muted: #475569;--muted-2: #94a3b8;position:fixed;inset:0;z-index:200;background:var(--bg);display:flex;flex-direction:column;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;animation:sr-slide-in .22s cubic-bezier(.22,1,.36,1)}@keyframes sr-slide-in{0%{transform:translate(8px);opacity:0}to{transform:translate(0);opacity:1}}.subroute{display:flex;flex-direction:column;flex:1;min-height:0}.sr-header{flex-shrink:0;display:flex;align-items:center;gap:8px;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top,0px));background:var(--surface);border-bottom:1px solid var(--border)}.sr-back{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;border:none;background:transparent;color:var(--muted);font-size:15px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}.sr-back:hover{background:var(--primary-soft);color:var(--primary)}.sr-title{margin:0;font-size:17px;font-weight:700;line-height:1.1;color:var(--text)}.sr-spacer{flex:1}.sr-body{flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14802
|
+
}
|
|
14803
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SubrouteShellComponent, decorators: [{
|
|
14804
|
+
type: Component,
|
|
14805
|
+
args: [{ selector: 'app-subroute-shell', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"subroute\" role=\"dialog\" aria-modal=\"true\" [attr.aria-label]=\"title()\">\n <header class=\"sr-header\">\n <button\n type=\"button\"\n class=\"sr-back\"\n (click)=\"back.emit()\"\n aria-label=\"Quay l\u1EA1i\"\n >\n <i class=\"pi pi-chevron-left\" aria-hidden=\"true\"></i>\n </button>\n <h1 class=\"sr-title\">{{ title() }}</h1>\n <span class=\"sr-spacer\"></span>\n <ng-content select=\"[slot=trailing]\"></ng-content>\n </header>\n <div class=\"sr-body\">\n <ng-content></ng-content>\n </div>\n</section>\n", styles: [":host{--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--primary: #5b6cff;--primary-soft: #eef0ff;--text: #0f172a;--muted: #475569;--muted-2: #94a3b8;position:fixed;inset:0;z-index:200;background:var(--bg);display:flex;flex-direction:column;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;animation:sr-slide-in .22s cubic-bezier(.22,1,.36,1)}@keyframes sr-slide-in{0%{transform:translate(8px);opacity:0}to{transform:translate(0);opacity:1}}.subroute{display:flex;flex-direction:column;flex:1;min-height:0}.sr-header{flex-shrink:0;display:flex;align-items:center;gap:8px;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top,0px));background:var(--surface);border-bottom:1px solid var(--border)}.sr-back{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;border:none;background:transparent;color:var(--muted);font-size:15px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}.sr-back:hover{background:var(--primary-soft);color:var(--primary)}.sr-title{margin:0;font-size:17px;font-weight:700;line-height:1.1;color:var(--text)}.sr-spacer{flex:1}.sr-body{flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch}\n"] }]
|
|
14806
|
+
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], back: [{ type: i0.Output, args: ["back"] }] } });
|
|
14807
|
+
|
|
14808
|
+
/**
|
|
14809
|
+
* Float menu full-screen — mở từ nút hamburger trên hero.
|
|
14810
|
+
* Chứa: Sửa profile bé, Cài đặt cho ăn, Mẹ, Explorer, Thông báo,
|
|
14811
|
+
* một khối About inline (tên + phiên bản), và Xoá profile (danger, đáy menu).
|
|
14812
|
+
*/
|
|
14813
|
+
class SettingsMenuComponent {
|
|
14814
|
+
constructor() {
|
|
14815
|
+
this.appName = input('', ...(ngDevMode ? [{ debugName: "appName" }] : /* istanbul ignore next */ []));
|
|
14816
|
+
this.appVersion = input('', ...(ngDevMode ? [{ debugName: "appVersion" }] : /* istanbul ignore next */ []));
|
|
14817
|
+
/** Hiển thị entry Explorer (chỉ khi explorer được bật). */
|
|
14818
|
+
this.showDocuments = input(false, ...(ngDevMode ? [{ debugName: "showDocuments" }] : /* istanbul ignore next */ []));
|
|
14819
|
+
/** Số thông báo chưa đọc — hiển thị badge cạnh entry Thông báo. */
|
|
14820
|
+
this.unreadCount = input(0, ...(ngDevMode ? [{ debugName: "unreadCount" }] : /* istanbul ignore next */ []));
|
|
14821
|
+
this.close = output();
|
|
14822
|
+
this.select = output();
|
|
14823
|
+
}
|
|
14824
|
+
onSelect(id) {
|
|
14825
|
+
this.select.emit(id);
|
|
14826
|
+
}
|
|
14827
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SettingsMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14828
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SettingsMenuComponent, isStandalone: true, selector: "app-settings-menu", inputs: { appName: { classPropertyName: "appName", publicName: "appName", isSignal: true, isRequired: false, transformFunction: null }, appVersion: { classPropertyName: "appVersion", publicName: "appVersion", isSignal: true, isRequired: false, transformFunction: null }, showDocuments: { classPropertyName: "showDocuments", publicName: "showDocuments", isSignal: true, isRequired: false, transformFunction: null }, unreadCount: { classPropertyName: "unreadCount", publicName: "unreadCount", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close", select: "select" }, ngImport: i0, template: "<section class=\"sm-root\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Menu\">\n <header class=\"sm-header\">\n <h1 class=\"sm-title\">C\u00E0i \u0111\u1EB7t</h1>\n <span class=\"sm-spacer\"></span>\n <button\n type=\"button\"\n class=\"sm-close\"\n (click)=\"close.emit()\"\n aria-label=\"\u0110\u00F3ng\"\n >\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n </header>\n\n <div class=\"sm-body\">\n <!-- \u2500\u2500 Profile actions \u2500\u2500 -->\n <nav class=\"sm-list\" role=\"menu\">\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('edit')\"\n >\n <i class=\"pi pi-pencil sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">S\u1EEDa profile b\u00E9</span>\n <span class=\"sm-item__hint\">\u0110\u1ED5i t\u00EAn, ng\u00E0y sinh, gi\u1EDBi t\u00EDnh</span>\n </span>\n </button>\n\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('settings')\"\n >\n <i class=\"pi pi-sliders-h sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">C\u00E0i \u0111\u1EB7t chung</span>\n <span class=\"sm-item__hint\">C\u1EA3nh b\u00E1o, ng\u01B0\u1EE1ng c\u1EEF, th\u00F4ng b\u00E1o\u2026</span>\n </span>\n </button>\n </nav>\n\n <hr class=\"sm-divider\" />\n\n <!-- \u2500\u2500 Subroute entries \u2500\u2500 -->\n <nav class=\"sm-list\" role=\"menu\">\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('mom')\"\n >\n <i class=\"pi pi-sun sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">M\u1EB9</span>\n <span class=\"sm-item__hint\">S\u1EE9c kho\u1EBB & dinh d\u01B0\u1EE1ng m\u1EB9</span>\n </span>\n <i class=\"pi pi-chevron-right sm-item__chev\" aria-hidden=\"true\"></i>\n </button>\n\n @if (showDocuments()) {\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('documents')\"\n >\n <i class=\"pi pi-folder sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">Explorer</span>\n <span class=\"sm-item__hint\">Kho t\u00E0i li\u1EC7u c\u1EE7a b\u00E9</span>\n </span>\n <i class=\"pi pi-chevron-right sm-item__chev\" aria-hidden=\"true\"></i>\n </button>\n }\n\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('notifications')\"\n >\n <i class=\"pi pi-bell sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">Th\u00F4ng b\u00E1o</span>\n <span class=\"sm-item__hint\">M\u1EDBi, \u0111\u00E3 \u0111\u1ECDc & c\u0169 h\u01A1n</span>\n </span>\n @if (unreadCount() > 0) {\n <span class=\"sm-item__badge\">{{ unreadCount() }}</span>\n } @else {\n <i class=\"pi pi-chevron-right sm-item__chev\" aria-hidden=\"true\"></i>\n }\n </button>\n </nav>\n\n <!-- \u2500\u2500 About inline \u2500\u2500 -->\n <section class=\"sm-about\" aria-label=\"About\">\n <div class=\"sm-about__icon\" aria-hidden=\"true\">\n <i class=\"pi pi-info-circle\"></i>\n </div>\n <div class=\"sm-about__body\">\n <span class=\"sm-about__name\">{{ appName() }}</span>\n <span class=\"sm-about__version\">Phi\u00EAn b\u1EA3n {{ appVersion() }}</span>\n </div>\n <span class=\"sm-about__tag\">App</span>\n </section>\n\n <!-- \u2500\u2500 Delete (bottom, danger) \u2500\u2500 -->\n <hr class=\"sm-divider sm-divider--strong\" />\n <nav class=\"sm-list sm-bottom\" role=\"menu\">\n <button\n type=\"button\"\n class=\"sm-item sm-item--danger\"\n role=\"menuitem\"\n (click)=\"onSelect('delete')\"\n >\n <i class=\"pi pi-trash sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">Xo\u00E1 profile</span>\n <span class=\"sm-item__hint\">G\u1EE1 h\u1ED3 s\u01A1 b\u00E9 kh\u1ECFi thi\u1EBFt b\u1ECB n\u00E0y</span>\n </span>\n </button>\n </nav>\n </div>\n</section>\n", styles: ["@charset \"UTF-8\";:host{--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--primary: #5b6cff;--primary-soft: #eef0ff;--accent: #ff5c8a;--accent-soft: #ffe7ef;--rose: #ef4444;--rose-soft: #fee2e2;--text: #0f172a;--muted: #475569;--muted-2: #94a3b8;position:fixed;inset:0;z-index:210;background:var(--bg);display:flex;flex-direction:column;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;animation:sm-slide-in .22s cubic-bezier(.22,1,.36,1)}@keyframes sm-slide-in{0%{transform:translate(8px);opacity:0}to{transform:translate(0);opacity:1}}.sm-root{display:flex;flex-direction:column;flex:1;min-height:0}.sm-header{flex-shrink:0;display:flex;align-items:center;gap:8px;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top,0px));background:var(--surface);border-bottom:1px solid var(--border)}.sm-title{margin:0;font-size:17px;font-weight:700;color:var(--text)}.sm-spacer{flex:1}.sm-close{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;border:none;background:transparent;color:var(--muted);font-size:15px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}.sm-close:hover{background:var(--primary-soft);color:var(--primary)}.sm-body{flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;padding:8px 0 calc(24px + env(safe-area-inset-bottom,0px))}.sm-list{display:flex;flex-direction:column;background:var(--surface)}.sm-divider{border:none;height:1px;background:var(--border);margin:0}.sm-divider--strong{height:8px;background:var(--bg)}.sm-item{display:flex;align-items:center;gap:14px;width:100%;padding:12px 16px;border:none;background:transparent;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s}.sm-item:hover{background:var(--primary-soft)}.sm-item:active{background:color-mix(in srgb,var(--primary-soft) 55%,var(--surface))}.sm-item__icon{flex-shrink:0;width:22px;text-align:center;font-size:16px;color:var(--muted)}.sm-item__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.sm-item__label{font-size:15px;font-weight:600;color:var(--text)}.sm-item__hint{font-size:12px;color:var(--muted-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sm-item__chev{flex-shrink:0;font-size:13px;color:var(--muted-2)}.sm-item__badge{flex-shrink:0;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--accent);color:#fff;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.sm-about{display:flex;align-items:center;gap:12px;margin:12px 12px 4px;padding:12px 14px;border-radius:14px;background:var(--primary-soft);border:1px solid color-mix(in srgb,var(--primary) 14%,transparent)}.sm-about__icon{flex-shrink:0;width:38px;height:38px;border-radius:999px;background:var(--surface);color:var(--primary);font-size:18px;display:flex;align-items:center;justify-content:center}.sm-about__body{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.sm-about__name{font-size:15px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sm-about__version{font-size:12px;color:var(--muted)}.sm-about__tag{flex-shrink:0;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--primary);background:var(--surface);padding:3px 8px;border-radius:999px}.sm-bottom{background:var(--surface)}.sm-item--danger:hover{background:var(--rose-soft)}.sm-item--danger:active{background:color-mix(in srgb,var(--rose-soft) 55%,var(--surface))}.sm-item--danger .sm-item__icon{color:var(--rose)}.sm-item--danger .sm-item__label{color:var(--rose);font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14829
|
+
}
|
|
14830
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SettingsMenuComponent, decorators: [{
|
|
14831
|
+
type: Component,
|
|
14832
|
+
args: [{ selector: 'app-settings-menu', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"sm-root\" role=\"dialog\" aria-modal=\"true\" aria-label=\"Menu\">\n <header class=\"sm-header\">\n <h1 class=\"sm-title\">C\u00E0i \u0111\u1EB7t</h1>\n <span class=\"sm-spacer\"></span>\n <button\n type=\"button\"\n class=\"sm-close\"\n (click)=\"close.emit()\"\n aria-label=\"\u0110\u00F3ng\"\n >\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n </header>\n\n <div class=\"sm-body\">\n <!-- \u2500\u2500 Profile actions \u2500\u2500 -->\n <nav class=\"sm-list\" role=\"menu\">\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('edit')\"\n >\n <i class=\"pi pi-pencil sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">S\u1EEDa profile b\u00E9</span>\n <span class=\"sm-item__hint\">\u0110\u1ED5i t\u00EAn, ng\u00E0y sinh, gi\u1EDBi t\u00EDnh</span>\n </span>\n </button>\n\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('settings')\"\n >\n <i class=\"pi pi-sliders-h sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">C\u00E0i \u0111\u1EB7t chung</span>\n <span class=\"sm-item__hint\">C\u1EA3nh b\u00E1o, ng\u01B0\u1EE1ng c\u1EEF, th\u00F4ng b\u00E1o\u2026</span>\n </span>\n </button>\n </nav>\n\n <hr class=\"sm-divider\" />\n\n <!-- \u2500\u2500 Subroute entries \u2500\u2500 -->\n <nav class=\"sm-list\" role=\"menu\">\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('mom')\"\n >\n <i class=\"pi pi-sun sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">M\u1EB9</span>\n <span class=\"sm-item__hint\">S\u1EE9c kho\u1EBB & dinh d\u01B0\u1EE1ng m\u1EB9</span>\n </span>\n <i class=\"pi pi-chevron-right sm-item__chev\" aria-hidden=\"true\"></i>\n </button>\n\n @if (showDocuments()) {\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('documents')\"\n >\n <i class=\"pi pi-folder sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">Explorer</span>\n <span class=\"sm-item__hint\">Kho t\u00E0i li\u1EC7u c\u1EE7a b\u00E9</span>\n </span>\n <i class=\"pi pi-chevron-right sm-item__chev\" aria-hidden=\"true\"></i>\n </button>\n }\n\n <button\n type=\"button\"\n class=\"sm-item\"\n role=\"menuitem\"\n (click)=\"onSelect('notifications')\"\n >\n <i class=\"pi pi-bell sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">Th\u00F4ng b\u00E1o</span>\n <span class=\"sm-item__hint\">M\u1EDBi, \u0111\u00E3 \u0111\u1ECDc & c\u0169 h\u01A1n</span>\n </span>\n @if (unreadCount() > 0) {\n <span class=\"sm-item__badge\">{{ unreadCount() }}</span>\n } @else {\n <i class=\"pi pi-chevron-right sm-item__chev\" aria-hidden=\"true\"></i>\n }\n </button>\n </nav>\n\n <!-- \u2500\u2500 About inline \u2500\u2500 -->\n <section class=\"sm-about\" aria-label=\"About\">\n <div class=\"sm-about__icon\" aria-hidden=\"true\">\n <i class=\"pi pi-info-circle\"></i>\n </div>\n <div class=\"sm-about__body\">\n <span class=\"sm-about__name\">{{ appName() }}</span>\n <span class=\"sm-about__version\">Phi\u00EAn b\u1EA3n {{ appVersion() }}</span>\n </div>\n <span class=\"sm-about__tag\">App</span>\n </section>\n\n <!-- \u2500\u2500 Delete (bottom, danger) \u2500\u2500 -->\n <hr class=\"sm-divider sm-divider--strong\" />\n <nav class=\"sm-list sm-bottom\" role=\"menu\">\n <button\n type=\"button\"\n class=\"sm-item sm-item--danger\"\n role=\"menuitem\"\n (click)=\"onSelect('delete')\"\n >\n <i class=\"pi pi-trash sm-item__icon\" aria-hidden=\"true\"></i>\n <span class=\"sm-item__body\">\n <span class=\"sm-item__label\">Xo\u00E1 profile</span>\n <span class=\"sm-item__hint\">G\u1EE1 h\u1ED3 s\u01A1 b\u00E9 kh\u1ECFi thi\u1EBFt b\u1ECB n\u00E0y</span>\n </span>\n </button>\n </nav>\n </div>\n</section>\n", styles: ["@charset \"UTF-8\";:host{--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--primary: #5b6cff;--primary-soft: #eef0ff;--accent: #ff5c8a;--accent-soft: #ffe7ef;--rose: #ef4444;--rose-soft: #fee2e2;--text: #0f172a;--muted: #475569;--muted-2: #94a3b8;position:fixed;inset:0;z-index:210;background:var(--bg);display:flex;flex-direction:column;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;animation:sm-slide-in .22s cubic-bezier(.22,1,.36,1)}@keyframes sm-slide-in{0%{transform:translate(8px);opacity:0}to{transform:translate(0);opacity:1}}.sm-root{display:flex;flex-direction:column;flex:1;min-height:0}.sm-header{flex-shrink:0;display:flex;align-items:center;gap:8px;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top,0px));background:var(--surface);border-bottom:1px solid var(--border)}.sm-title{margin:0;font-size:17px;font-weight:700;color:var(--text)}.sm-spacer{flex:1}.sm-close{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;border:none;background:transparent;color:var(--muted);font-size:15px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s,color .15s}.sm-close:hover{background:var(--primary-soft);color:var(--primary)}.sm-body{flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;padding:8px 0 calc(24px + env(safe-area-inset-bottom,0px))}.sm-list{display:flex;flex-direction:column;background:var(--surface)}.sm-divider{border:none;height:1px;background:var(--border);margin:0}.sm-divider--strong{height:8px;background:var(--bg)}.sm-item{display:flex;align-items:center;gap:14px;width:100%;padding:12px 16px;border:none;background:transparent;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s}.sm-item:hover{background:var(--primary-soft)}.sm-item:active{background:color-mix(in srgb,var(--primary-soft) 55%,var(--surface))}.sm-item__icon{flex-shrink:0;width:22px;text-align:center;font-size:16px;color:var(--muted)}.sm-item__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.sm-item__label{font-size:15px;font-weight:600;color:var(--text)}.sm-item__hint{font-size:12px;color:var(--muted-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sm-item__chev{flex-shrink:0;font-size:13px;color:var(--muted-2)}.sm-item__badge{flex-shrink:0;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--accent);color:#fff;font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.sm-about{display:flex;align-items:center;gap:12px;margin:12px 12px 4px;padding:12px 14px;border-radius:14px;background:var(--primary-soft);border:1px solid color-mix(in srgb,var(--primary) 14%,transparent)}.sm-about__icon{flex-shrink:0;width:38px;height:38px;border-radius:999px;background:var(--surface);color:var(--primary);font-size:18px;display:flex;align-items:center;justify-content:center}.sm-about__body{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.sm-about__name{font-size:15px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sm-about__version{font-size:12px;color:var(--muted)}.sm-about__tag{flex-shrink:0;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--primary);background:var(--surface);padding:3px 8px;border-radius:999px}.sm-bottom{background:var(--surface)}.sm-item--danger:hover{background:var(--rose-soft)}.sm-item--danger:active{background:color-mix(in srgb,var(--rose-soft) 55%,var(--surface))}.sm-item--danger .sm-item__icon{color:var(--rose)}.sm-item--danger .sm-item__label{color:var(--rose);font-weight:600}\n"] }]
|
|
14833
|
+
}], propDecorators: { appName: [{ type: i0.Input, args: [{ isSignal: true, alias: "appName", required: false }] }], appVersion: [{ type: i0.Input, args: [{ isSignal: true, alias: "appVersion", required: false }] }], showDocuments: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDocuments", required: false }] }], unreadCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "unreadCount", required: false }] }], close: [{ type: i0.Output, args: ["close"] }], select: [{ type: i0.Output, args: ["select"] }] } });
|
|
14834
|
+
|
|
14641
14835
|
const STORAGE_PREFIX = 'feeding-profile::';
|
|
14642
14836
|
const INITIAL_NOTIFICATION_VISIBLE = 2;
|
|
14643
14837
|
class FeedingComponent {
|
|
@@ -14676,18 +14870,22 @@ class FeedingComponent {
|
|
|
14676
14870
|
this.explorerEnabled = this.feedingConfig.enableExplorer;
|
|
14677
14871
|
this.aboutDialogOpen = signal(false, ...(ngDevMode ? [{ debugName: "aboutDialogOpen" }] : /* istanbul ignore next */ []));
|
|
14678
14872
|
this.Math = Math;
|
|
14679
|
-
/**
|
|
14873
|
+
/**
|
|
14874
|
+
* Tab nav phía dưới (đã rework): 4 tab thường ở hai bên + FAB « + » ở giữa.
|
|
14875
|
+
* Cữ bú · Thể trạng · + · Lịch · Y tế
|
|
14876
|
+
* Mẹ & Tài liệu được dời vào float menu Settings (mở subroute riêng).
|
|
14877
|
+
*/
|
|
14680
14878
|
this.bottomTab = signal('feeding', ...(ngDevMode ? [{ debugName: "bottomTab" }] : /* istanbul ignore next */ []));
|
|
14681
14879
|
this.navTabs = computed(() => [
|
|
14682
14880
|
{ id: 'feeding', icon: 'pi-heart-fill', label: 'Cữ bú' },
|
|
14683
14881
|
{ id: 'weight', icon: 'pi-chart-line', label: 'Thể trạng' },
|
|
14684
14882
|
{ id: 'schedule', icon: 'pi-calendar', label: 'Lịch' },
|
|
14685
|
-
{ id: 'mom', icon: 'pi-sun', label: 'Mẹ' },
|
|
14686
14883
|
{ id: 'medical', icon: 'pi-book', label: 'Y tế' },
|
|
14687
|
-
...(this.explorerEnabled
|
|
14688
|
-
? [{ id: 'documents', icon: 'pi-folder', label: 'Tài liệu' }]
|
|
14689
|
-
: []),
|
|
14690
14884
|
], ...(ngDevMode ? [{ debugName: "navTabs" }] : /* istanbul ignore next */ []));
|
|
14885
|
+
/** 2 tab bên trái của bottom-nav (Cữ bú, Thể trạng). */
|
|
14886
|
+
this.navLeftTabs = computed(() => this.navTabs().slice(0, 2), ...(ngDevMode ? [{ debugName: "navLeftTabs" }] : /* istanbul ignore next */ []));
|
|
14887
|
+
/** 2 tab bên phải của bottom-nav (Lịch, Y tế). */
|
|
14888
|
+
this.navRightTabs = computed(() => this.navTabs().slice(2), ...(ngDevMode ? [{ debugName: "navRightTabs" }] : /* istanbul ignore next */ []));
|
|
14691
14889
|
this.activeTabIndex = computed(() => this.navTabs().findIndex((t) => t.id === this.bottomTab()), ...(ngDevMode ? [{ debugName: "activeTabIndex" }] : /* istanbul ignore next */ []));
|
|
14692
14890
|
this.user = signal('guest', ...(ngDevMode ? [{ debugName: "user" }] : /* istanbul ignore next */ []));
|
|
14693
14891
|
this.profile = signal(null, ...(ngDevMode ? [{ debugName: "profile" }] : /* istanbul ignore next */ []));
|
|
@@ -14732,6 +14930,14 @@ class FeedingComponent {
|
|
|
14732
14930
|
this.notificationComposerDialogOpen = signal(false, ...(ngDevMode ? [{ debugName: "notificationComposerDialogOpen" }] : /* istanbul ignore next */ []));
|
|
14733
14931
|
/** Controls the notification bottom-sheet dialog — managed here so the overlay renders outside <header> */
|
|
14734
14932
|
this.notifDialogOpen = signal(false, ...(ngDevMode ? [{ debugName: "notifDialogOpen" }] : /* istanbul ignore next */ []));
|
|
14933
|
+
/** Subroute trang danh sách thông báo (full-screen, thay bottom-sheet cũ). */
|
|
14934
|
+
this.notifRouteOpen = signal(false, ...(ngDevMode ? [{ debugName: "notifRouteOpen" }] : /* istanbul ignore next */ []));
|
|
14935
|
+
/** Float menu Settings full-screen (mở từ nút gear trên hero). */
|
|
14936
|
+
this.settingsMenuOpen = signal(false, ...(ngDevMode ? [{ debugName: "settingsMenuOpen" }] : /* istanbul ignore next */ []));
|
|
14937
|
+
/** Subroute Mẹ (full-screen, mở từ Settings menu). */
|
|
14938
|
+
this.momRouteOpen = signal(false, ...(ngDevMode ? [{ debugName: "momRouteOpen" }] : /* istanbul ignore next */ []));
|
|
14939
|
+
/** Subroute Tài liệu (full-screen, mở từ Settings menu). */
|
|
14940
|
+
this.documentsRouteOpen = signal(false, ...(ngDevMode ? [{ debugName: "documentsRouteOpen" }] : /* istanbul ignore next */ []));
|
|
14735
14941
|
this.acknowledgeAllConfirmDialogOpen = signal(false, ...(ngDevMode ? [{ debugName: "acknowledgeAllConfirmDialogOpen" }] : /* istanbul ignore next */ []));
|
|
14736
14942
|
/** Ngày đang xem trên card lịch sử (mặc định: hôm qua). */
|
|
14737
14943
|
this.ageInDays = computed(() => {
|
|
@@ -14771,6 +14977,8 @@ class FeedingComponent {
|
|
|
14771
14977
|
.notifications()
|
|
14772
14978
|
.filter((item) => !item.acknowledgeUsers.includes(currentUser));
|
|
14773
14979
|
}, ...(ngDevMode ? [{ debugName: "visibleNotifications" }] : /* istanbul ignore next */ []));
|
|
14980
|
+
/** Toàn bộ thông báo (đã + chưa đọc) cho subroute danh sách. */
|
|
14981
|
+
this.allNotifications = computed(() => this.notificationLogService.notifications(), ...(ngDevMode ? [{ debugName: "allNotifications" }] : /* istanbul ignore next */ []));
|
|
14774
14982
|
this.displayedNotifications = computed(() => {
|
|
14775
14983
|
return this.visibleNotifications().slice(0, INITIAL_NOTIFICATION_VISIBLE);
|
|
14776
14984
|
}, ...(ngDevMode ? [{ debugName: "displayedNotifications" }] : /* istanbul ignore next */ []));
|
|
@@ -15075,6 +15283,60 @@ class FeedingComponent {
|
|
|
15075
15283
|
openNotificationListDialog() {
|
|
15076
15284
|
this.notificationListDialogOpen.set(true);
|
|
15077
15285
|
}
|
|
15286
|
+
/** Mở subroute danh sách thông báo (full-screen). */
|
|
15287
|
+
openNotificationRoute() {
|
|
15288
|
+
this.notifRouteOpen.set(true);
|
|
15289
|
+
}
|
|
15290
|
+
closeNotificationRoute() {
|
|
15291
|
+
if (this.notificationSaving())
|
|
15292
|
+
return;
|
|
15293
|
+
this.notifRouteOpen.set(false);
|
|
15294
|
+
}
|
|
15295
|
+
// ── Settings float menu ──
|
|
15296
|
+
openSettingsMenu() {
|
|
15297
|
+
this.settingsMenuOpen.set(true);
|
|
15298
|
+
}
|
|
15299
|
+
closeSettingsMenu() {
|
|
15300
|
+
this.settingsMenuOpen.set(false);
|
|
15301
|
+
}
|
|
15302
|
+
onSettingsMenuSelect(id) {
|
|
15303
|
+
this.settingsMenuOpen.set(false);
|
|
15304
|
+
switch (id) {
|
|
15305
|
+
case 'edit':
|
|
15306
|
+
this.startEdit();
|
|
15307
|
+
break;
|
|
15308
|
+
case 'settings':
|
|
15309
|
+
this.feedingDialogs?.openFeedingSettingsDialog();
|
|
15310
|
+
break;
|
|
15311
|
+
case 'mom':
|
|
15312
|
+
this.openMomRoute();
|
|
15313
|
+
break;
|
|
15314
|
+
case 'documents':
|
|
15315
|
+
this.openDocumentsRoute();
|
|
15316
|
+
break;
|
|
15317
|
+
case 'notifications':
|
|
15318
|
+
this.openNotificationRoute();
|
|
15319
|
+
break;
|
|
15320
|
+
case 'delete':
|
|
15321
|
+
this.clearProfile();
|
|
15322
|
+
break;
|
|
15323
|
+
}
|
|
15324
|
+
}
|
|
15325
|
+
// ── Mẹ / Tài liệu subroutes ──
|
|
15326
|
+
openMomRoute() {
|
|
15327
|
+
this.momRouteOpen.set(true);
|
|
15328
|
+
}
|
|
15329
|
+
closeMomRoute() {
|
|
15330
|
+
this.momRouteOpen.set(false);
|
|
15331
|
+
}
|
|
15332
|
+
openDocumentsRoute() {
|
|
15333
|
+
if (!this.explorerEnabled)
|
|
15334
|
+
return;
|
|
15335
|
+
this.documentsRouteOpen.set(true);
|
|
15336
|
+
}
|
|
15337
|
+
closeDocumentsRoute() {
|
|
15338
|
+
this.documentsRouteOpen.set(false);
|
|
15339
|
+
}
|
|
15078
15340
|
closeNotificationListDialog() {
|
|
15079
15341
|
if (this.notificationSaving())
|
|
15080
15342
|
return;
|
|
@@ -15421,9 +15683,11 @@ class FeedingComponent {
|
|
|
15421
15683
|
onActivityChanged() {
|
|
15422
15684
|
this.refreshAll();
|
|
15423
15685
|
}
|
|
15424
|
-
/** Ảnh đính kèm trên timeline Y tế →
|
|
15686
|
+
/** Ảnh đính kèm trên timeline Y tế → mở subroute Tài liệu + preview file Explorer. */
|
|
15425
15687
|
openMedicalAttachmentInDocuments(explorerEntryId) {
|
|
15426
|
-
this.
|
|
15688
|
+
if (!this.explorerEnabled)
|
|
15689
|
+
return;
|
|
15690
|
+
this.documentsRouteOpen.set(true);
|
|
15427
15691
|
setTimeout(() => {
|
|
15428
15692
|
this.documentsCmp?.revealFileEntry(explorerEntryId);
|
|
15429
15693
|
}, 0);
|
|
@@ -15557,7 +15821,7 @@ class FeedingComponent {
|
|
|
15557
15821
|
}).format(kg);
|
|
15558
15822
|
}
|
|
15559
15823
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: FeedingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15560
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: FeedingComponent, isStandalone: true, selector: "app-feeding", viewQueries: [{ propertyName: "feedingPageRef", first: true, predicate: ["feedingPage"], descendants: true, static: true }, { propertyName: "documentsCmp", first: true, predicate: DocumentsComponent, descendants: true }, { propertyName: "medicalCmp", first: true, predicate: MedicalHistoryComponent, descendants: true }, { propertyName: "weightCmp", first: true, predicate: WeightComponent, descendants: true }], ngImport: i0, template: "<div class=\"feeding-root\">\n <div class=\"feeding-page\" #feedingPage>\n <div class=\"backdrop\"></div>\n\n <header class=\"hero\" [class.hero--profile-merged]=\"profile() && !editing() && ageBreakdown()\">\n @if (profile() && !editing() && ageBreakdown(); as age) {\n <!-- \u2550\u2550 REDESIGNED HERO \u2550\u2550 -->\n <app-hero-header\n [profile]=\"profile()!\"\n [age]=\"age\"\n [user]=\"user()\"\n [weightLabel]=\"profileHeroWeightLabel()\"\n [isAnyLoading]=\"isAnyLoading()\"\n [showRefresh]=\"bottomTab() !== 'schedule'\"\n (editProfile)=\"startEdit()\"\n (deleteProfile)=\"clearProfile()\"\n (openSettings)=\"feedingDialogs.openFeedingSettingsDialog()\"\n (openAbout)=\"openAboutDialog()\"\n (refresh)=\"refreshAll()\"\n >\n <app-activity-log slot=\"activity-log\" (activityChanged)=\"onActivityChanged()\"></app-activity-log>\n </app-hero-header>\n\n <app-hero-stats-strip\n [currentTime]=\"currentTimeStr\"\n [dateLabel]=\"heroDateLabel\"\n [nextFeedTime]=\"prediction()?.nextTime ?? null\"\n [nextFeedCountdown]=\"heroNextFeedCountdown()\"\n [weightLabel]=\"profileHeroWeightLabel()\"\n [whoStatus]=\"nutritionTarget()?.ageLabel ?? null\"\n ></app-hero-stats-strip>\n\n <div class=\"hero-notif-wrap\">\n <app-notification-banner\n [notifications]=\"visibleNotifications()\"\n [saving]=\"notificationSaving()\"\n [currentUser]=\"user()\"\n [dialogOpen]=\"notifDialogOpen()\"\n (openDialog)=\"notifDialogOpen.set(true)\"\n (closeDialog)=\"notifDialogOpen.set(false)\"\n (acknowledge)=\"acknowledgeNotification($event)\"\n (acknowledgeAll)=\"notifDialogOpen.set(false); openAcknowledgeAllConfirmDialog()\"\n (delete)=\"deleteNotification($event)\"\n (openComposer)=\"notifDialogOpen.set(false); openNotificationComposerDialog()\"\n ></app-notification-banner>\n </div>\n\n } @else {\n <!-- \u2500\u2500 Fallback: no profile / editing \u2500\u2500 -->\n <div class=\"hero-inner\">\n <div class=\"hero-brand\">\n <div class=\"hero-title-row\">\n <div class=\"hero-title\">\n <div class=\"emoji\" aria-hidden=\"true\">\uD83D\uDC76</div>\n <div class=\"hero-text\">\n <h1>B\u00E9 y\u00EAu c\u1EE7a b\u1EA1n</h1>\n <p class=\"hero-userline\">\n <i class=\"pi pi-user\" aria-hidden=\"true\"></i>\n <strong>{{ user() }}</strong>\n </p>\n </div>\n </div>\n @if (profile() && !editing()) {\n <div class=\"hero-actions\">\n <app-activity-log (activityChanged)=\"onActivityChanged()\"></app-activity-log>\n <button\n class=\"btn icon-btn\"\n type=\"button\"\n (click)=\"feedingDialogs.openFeedingSettingsDialog()\"\n title=\"C\u00E0i \u0111\u1EB7t\"\n aria-label=\"C\u00E0i \u0111\u1EB7t c\u1EEF b\u00FA\"\n >\n <i class=\"pi pi-sliders-h\"></i>\n </button>\n @if (bottomTab() !== 'schedule') {\n <button\n class=\"btn icon-btn\"\n type=\"button\"\n (click)=\"refreshAll()\"\n [disabled]=\"isAnyLoading()\"\n [title]=\"\n isAnyLoading() ? '\u0110ang t\u1EA3i\u2026' : 'T\u1EA3i l\u1EA1i C\u1EEF b\u00FA, C\u00E2n, L\u1ECBch, Y t\u1EBF, T\u00E0i li\u1EC7u'\n \"\n aria-label=\"T\u1EA3i l\u1EA1i C\u1EEF b\u00FA, Th\u1EC3 tr\u1EA1ng, L\u1ECBch, Ti\u1EC1n s\u1EED y t\u1EBF v\u00E0 T\u00E0i li\u1EC7u\"\n >\n <i class=\"pi pi-refresh\" [class.spin]=\"isAnyLoading()\"></i>\n </button>\n }\n </div>\n }\n </div>\n </div>\n\n <div class=\"hero-datetime\" aria-live=\"polite\">\n <div class=\"hero-datetime-strip\">\n <div class=\"hero-datetime-strip__block hero-datetime-strip__block--date\">\n <i class=\"pi pi-calendar\" aria-hidden=\"true\"></i>\n <span class=\"hero-datetime-strip__wd\">{{ heroWeekday }}</span>\n <time class=\"hero-datetime-strip__date\" [attr.datetime]=\"todayDateStr()\">{{\n heroDateNumeric\n }}</time>\n </div>\n <span class=\"hero-datetime-strip__divider\" aria-hidden=\"true\"></span>\n <div class=\"hero-datetime-strip__block hero-datetime-strip__block--time\">\n <i class=\"pi pi-clock\" aria-hidden=\"true\"></i>\n <span class=\"hero-datetime-strip__clock\">{{ currentTimeStr }}</span>\n </div>\n </div>\n </div>\n\n <section class=\"hero-notification\" aria-label=\"Th\u00F4ng b\u00E1o n\u1ED9i b\u1ED9\">\n <!-- watermark background icons -->\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-bell\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-megaphone\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-comments\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--send\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-send\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--star\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-star\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--bolt\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-bolt\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--heart\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-heart\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--info\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-info-circle\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--check\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-check-circle\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--eye\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-eye\"></i>\n </span>\n\n <div class=\"hero-notification__head\">\n <label class=\"hero-notification__composer-label\" for=\"hero-notification-input\">\n <i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i>\n <span>Th\u00F4ng b\u00E1o</span>\n @if (visibleNotifications().length > 0) {\n <span class=\"hero-notification__unread-badge\">{{\n visibleNotifications().length\n }}</span>\n }\n </label>\n <div class=\"hero-notification__head-actions\">\n <button\n type=\"button\"\n class=\"hero-notification__mark-all\"\n (click)=\"openAcknowledgeAllConfirmDialog()\"\n [disabled]=\"notificationSaving() || visibleNotifications().length === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n \u0110\u00E3 \u0111\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button\n type=\"button\"\n class=\"hero-notification__add\"\n (click)=\"openNotificationComposerDialog()\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n title=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n\n @if (displayedNotifications().length > 0) {\n <ul class=\"hero-notification__list\">\n @for (notice of displayedNotifications(); track notice) {\n <li class=\"hero-notification__item\">\n <div class=\"hero-notification__avatar\" aria-hidden=\"true\">\n {{ notice.user | slice: 0 : 2 | uppercase }}\n </div>\n <div class=\"hero-notification__body\">\n <div class=\"hero-notification__body-head\">\n <span class=\"hero-notification__author\">{{ notice.user }}</span>\n </div>\n <p class=\"hero-notification__content\">{{ notice.content }}</p>\n @if (notice.createdAt) {\n <span class=\"hero-notification__created\">{{\n formatNotificationCreatedAt(notice.createdAt)\n }}</span>\n }\n </div>\n <div class=\"hero-notification__item-actions\">\n <button\n type=\"button\"\n class=\"hero-notification__ack-top\"\n (click)=\"acknowledgeNotification(notice)\"\n [disabled]=\"notificationSaving()\"\n aria-label=\"\u0110\u00E3 \u0111\u1ECDc th\u00F4ng b\u00E1o\"\n title=\"\u0110\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDeleteNotification(notice)) {\n <button\n type=\"button\"\n class=\"hero-notification__delete\"\n (click)=\"deleteNotification(notice)\"\n [disabled]=\"notificationSaving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\"\n title=\"X\u00F3a th\u00F4ng b\u00E1o\"\n >\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </li>\n }\n </ul>\n } @else {\n <div class=\"hero-notification__empty\">\n <i class=\"pi pi-bell hero-notification__empty-icon\" aria-hidden=\"true\"></i>\n <span class=\"hero-notification__empty-title\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n <span class=\"hero-notification__empty-sub\"\n >M\u1ECDi th\u1EE9 \u0111\u1EC1u \u1ED5n. Th\u00F4ng b\u00E1o m\u1EDBi s\u1EBD xu\u1EA5t hi\u1EC7n \u1EDF \u0111\u00E2y.</span\n >\n </div>\n }\n\n @if (hiddenNotificationCount() > 0) {\n <button\n type=\"button\"\n class=\"hero-notification__more\"\n (click)=\"openNotificationListDialog()\"\n >\n Xem th\u00EAm {{ hiddenNotificationCount() }} th\u00F4ng b\u00E1o \u2192\n </button>\n }\n </section>\n\n </div>\n } <!-- end @else no-profile -->\n </header>\n\n <!-- \u2550\u2550 NOTIFICATION DIALOGS \u2014 rendered outside <header> to avoid overflow/stacking-context clipping \u2550\u2550 -->\n @if (notificationComposerDialogOpen()) {\n <div\n class=\"dialog-overlay dialog-overlay--front\"\n (click)=\"closeNotificationComposerDialog()\"\n >\n <div\n class=\"dialog hero-notification-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n (click)=\"$event.stopPropagation()\"\n >\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\" aria-hidden=\"true\"><i class=\"pi pi-bell\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\" aria-hidden=\"true\"><i class=\"pi pi-megaphone\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--send\" aria-hidden=\"true\"><i class=\"pi pi-send\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--star\" aria-hidden=\"true\"><i class=\"pi pi-star\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\" aria-hidden=\"true\"><i class=\"pi pi-comments\"></i></span>\n\n <div class=\"dialog-head hero-notification-dialog__head\">\n <div class=\"hero-notification-dialog__title-group\">\n <div class=\"hero-notification-dialog__icon-wrap\">\n <i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i>\n </div>\n <div>\n <h2 class=\"hero-notification-dialog__title\">T\u1EA1o th\u00F4ng b\u00E1o</h2>\n <p class=\"hero-notification-dialog__subtitle\">Th\u00F4ng b\u00E1o s\u1EBD hi\u1EC3n th\u1ECB cho to\u00E0n b\u1ED9 th\u00E0nh vi\u00EAn</p>\n </div>\n </div>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeNotificationComposerDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <div class=\"hero-notification__composer-panel\">\n <div class=\"hero-notification__composer-row\">\n <div class=\"hero-notification__input-wrap\">\n <textarea\n id=\"hero-notification-input\"\n class=\"hero-notification__input\"\n [value]=\"notificationDraft()\"\n (input)=\"updateNotificationDraft($any($event.target).value)\"\n [disabled]=\"notificationSaving()\"\n maxlength=\"300\"\n placeholder=\"Nh\u1EADp n\u1ED9i dung th\u00F4ng b\u00E1o cho m\u1ECDi ng\u01B0\u1EDDi...\"\n aria-label=\"N\u1ED9i dung th\u00F4ng b\u00E1o\"\n ></textarea>\n <div class=\"hero-notification__char-ring\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 36 36\">\n <circle class=\"hero-notification__char-ring-track\" cx=\"18\" cy=\"18\" r=\"15\" />\n <circle class=\"hero-notification__char-ring-fill\" cx=\"18\" cy=\"18\" r=\"15\"\n [style.stroke-dashoffset]=\"94 - (notificationDraft().trim().length / 300) * 94\" />\n </svg>\n <span class=\"hero-notification__char-count\">{{ notificationDraft().trim().length }}</span>\n </div>\n </div>\n </div>\n <div class=\"hero-notification__composer-actions\">\n <button type=\"button\" class=\"btn ghost hero-notification__cancel\"\n (click)=\"closeNotificationComposerDialog()\" [disabled]=\"notificationSaving()\">H\u1EE7y</button>\n <button type=\"button\" class=\"btn hero-notification__send\"\n (click)=\"createNotification()\"\n [disabled]=\"notificationSaving() || !notificationDraft().trim()\">\n <i class=\"pi pi-send\"></i>\n <span>G\u1EEDi th\u00F4ng b\u00E1o</span>\n </button>\n </div>\n </div>\n @if (notificationError()) {\n <p class=\"hero-notification__error\">{{ notificationError() }}</p>\n }\n </div>\n </div>\n }\n\n @if (notificationListDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeNotificationListDialog()\">\n <div class=\"dialog hero-notification-list-dialog\" role=\"dialog\" aria-modal=\"true\"\n aria-label=\"Danh s\u00E1ch th\u00F4ng b\u00E1o\" (click)=\"$event.stopPropagation()\">\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\" aria-hidden=\"true\"><i class=\"pi pi-bell\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\" aria-hidden=\"true\"><i class=\"pi pi-megaphone\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\" aria-hidden=\"true\"><i class=\"pi pi-comments\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--star\" aria-hidden=\"true\"><i class=\"pi pi-star\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--check\" aria-hidden=\"true\"><i class=\"pi pi-check-circle\"></i></span>\n\n <div class=\"dialog-head hero-notification-list-dialog__head\">\n <div class=\"hero-notification-dialog__title-group\">\n <div class=\"hero-notification-dialog__icon-wrap\"><i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i></div>\n <div>\n <h2 class=\"hero-notification-list-dialog__title\">To\u00E0n b\u1ED9 th\u00F4ng b\u00E1o</h2>\n <p class=\"hero-notification-dialog__subtitle\">{{ visibleNotifications().length }} th\u00F4ng b\u00E1o</p>\n </div>\n </div>\n <div class=\"hero-notification-list-dialog__head-actions\">\n <button type=\"button\" class=\"hero-notification__mark-all\"\n (click)=\"openAcknowledgeAllConfirmDialog()\"\n [disabled]=\"notificationSaving() || visibleNotifications().length === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\">\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i> \u0110\u00E3 \u0111\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeNotificationListDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n </div>\n <div class=\"hero-notification-list-dialog__body\">\n @if (visibleNotifications().length > 0) {\n <ul class=\"hero-notification__list\">\n @for (notice of visibleNotifications(); track notice) {\n <li class=\"hero-notification__item\">\n <div class=\"hero-notification__avatar\" aria-hidden=\"true\">{{ notice.user | slice: 0 : 2 | uppercase }}</div>\n <div class=\"hero-notification__body\">\n <div class=\"hero-notification__body-head\">\n <span class=\"hero-notification__author\">{{ notice.user }}</span>\n </div>\n <p class=\"hero-notification__content\">{{ notice.content }}</p>\n @if (notice.createdAt) {\n <span class=\"hero-notification__created\">{{ formatNotificationCreatedAt(notice.createdAt) }}</span>\n }\n </div>\n <div class=\"hero-notification__item-actions\">\n <button type=\"button\" class=\"hero-notification__ack-top\"\n (click)=\"acknowledgeNotification(notice)\" [disabled]=\"notificationSaving()\"\n aria-label=\"\u0110\u00E3 \u0111\u1ECDc th\u00F4ng b\u00E1o\" title=\"\u0110\u00E3 \u0111\u1ECDc\">\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDeleteNotification(notice)) {\n <button type=\"button\" class=\"hero-notification__delete\"\n (click)=\"deleteNotification(notice)\" [disabled]=\"notificationSaving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\" title=\"X\u00F3a th\u00F4ng b\u00E1o\">\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </li>\n }\n </ul>\n } @else {\n <div class=\"hero-notification__empty\">\n <i class=\"pi pi-bell hero-notification__empty-icon\" aria-hidden=\"true\"></i>\n <span class=\"hero-notification__empty-title\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n <span class=\"hero-notification__empty-sub\">M\u1ECDi th\u1EE9 \u0111\u1EC1u \u1ED5n. Th\u00F4ng b\u00E1o m\u1EDBi s\u1EBD xu\u1EA5t hi\u1EC7n \u1EDF \u0111\u00E2y.</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n\n @if (acknowledgeAllConfirmDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeAcknowledgeAllConfirmDialog()\">\n <div class=\"dialog ack-all-confirm-dialog\" role=\"alertdialog\" aria-modal=\"true\"\n aria-labelledby=\"ack-all-confirm-title\" (click)=\"$event.stopPropagation()\">\n <div class=\"ack-all-confirm-dialog__icon-wrap\" aria-hidden=\"true\"><i class=\"pi pi-check-circle\"></i></div>\n <h2 id=\"ack-all-confirm-title\" class=\"ack-all-confirm-dialog__title\">\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc?</h2>\n <p class=\"ack-all-confirm-dialog__desc\">\n T\u1EA5t c\u1EA3 {{ visibleNotifications().length }} th\u00F4ng b\u00E1o s\u1EBD \u0111\u01B0\u1EE3c \u0111\u00E1nh d\u1EA5u \u0111\u00E3 \u0111\u1ECDc v\u00E0 \u1EA9n kh\u1ECFi danh s\u00E1ch.\n </p>\n <div class=\"ack-all-confirm-dialog__actions\">\n <button type=\"button\" class=\"btn ghost\" (click)=\"closeAcknowledgeAllConfirmDialog()\" [disabled]=\"notificationSaving()\">H\u1EE7y</button>\n <button type=\"button\" class=\"btn ack-all-confirm-dialog__confirm-btn\"\n (click)=\"confirmAcknowledgeAll()\" [disabled]=\"notificationSaving()\">\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i> X\u00E1c nh\u1EADn\n </button>\n </div>\n </div>\n </div>\n }\n\n <main\n class=\"content\"\n [class.is-documents]=\"bottomTab() === 'documents'\"\n [class.is-weight]=\"bottomTab() === 'weight'\"\n [class.is-schedule]=\"bottomTab() === 'schedule'\"\n [class.is-mom]=\"bottomTab() === 'mom'\"\n [class.is-medical]=\"bottomTab() === 'medical'\"\n >\n <!--\n ============ TAB PANES ============\n D\u00F9ng `[hidden]` thay v\u00EC `*ngIf` \u0111\u1EC3 c\u00E1c tab c\u00F9ng gi\u1EEF tr\u1EA1ng th\u00E1i khi\n user qua l\u1EA1i: scroll position, search query \u0111ang g\u00F5, viewMode, folder\n \u0111ang \u0111\u1EE9ng, file \u0111ang ch\u1ECDn, draft \u0111ang nh\u1EADp\u2026 \u0111\u1EC1u kh\u00F4ng b\u1ECB reset. H\u1EC7\n qu\u1EA3: `<app-documents>` \u0111\u01B0\u1EE3c mount 1 l\u1EA7n \u1EDF app load \u2014 `loadEntries()`\n ch\u1EA1y 1 l\u1EA7n, c\u00E1c l\u1EA7n switch tab k\u1EBF ti\u1EBFp kh\u00F4ng g\u1ECDi API th\u00EAm.\n -->\n <!-- ============ TAB: DOCUMENTS ============ -->\n @if (explorerEnabled) {\n <div class=\"tab-pane tab-pane--documents\" [hidden]=\"bottomTab() !== 'documents'\">\n <app-documents></app-documents>\n </div>\n }\n\n <!-- ============ TAB: WEIGHT ============ -->\n <div class=\"tab-pane tab-pane--weight\" [hidden]=\"bottomTab() !== 'weight'\">\n <app-weight\n [user]=\"user()\"\n [birthDate]=\"profile()?.birthDate\"\n [gender]=\"profile()?.gender\"\n [babyName]=\"profile()?.babyName\"\n ></app-weight>\n </div>\n\n <!-- ============ TAB: L\u1ECACH \u2014 Google Sheet tab \"Event\" ============ -->\n <div class=\"tab-pane tab-pane--schedule\" [hidden]=\"bottomTab() !== 'schedule'\">\n <app-feeding-schedule [user]=\"user()\"></app-feeding-schedule>\n </div>\n\n <!-- ============ TAB: TI\u1EC0N S\u1EEC Y T\u1EBE \u2014 Medical history V2 ============ -->\n <div class=\"tab-pane tab-pane--medical\" [hidden]=\"bottomTab() !== 'medical'\">\n <app-medical-history\n [user]=\"user()\"\n (openExplorerFile)=\"openMedicalAttachmentInDocuments($event)\"\n ></app-medical-history>\n </div>\n\n <!-- ============ TAB: M\u1EB8 ============ -->\n <div class=\"tab-pane tab-pane--mom\" [hidden]=\"bottomTab() !== 'mom'\">\n <app-feeding-mom\n [profile]=\"profile()\"\n [editing]=\"editing()\"\n (goToFeeding)=\"setBottomTab('feeding')\"\n ></app-feeding-mom>\n </div>\n\n <!-- ============ TAB: FEEDING ============ -->\n <div class=\"tab-pane tab-pane--feeding\" [hidden]=\"bottomTab() !== 'feeding'\">\n <app-feeding-profile\n [user]=\"user()\"\n [profile]=\"profile()\"\n [draft]=\"draft()\"\n [editing]=\"editing()\"\n [maxBirthDate]=\"maxBirthDate\"\n (save)=\"save()\"\n (cancelEdit)=\"cancelEdit()\"\n (startEdit)=\"startEdit()\"\n (clearProfile)=\"clearProfile()\"\n (draftNameChange)=\"updateDraftName($event)\"\n (draftBirthChange)=\"updateDraftBirth($event)\"\n (draftGenderChange)=\"setDraftGender($event)\"\n />\n\n @if (profile() && !editing() && ageBreakdown()) {\n <app-feeding-daily\n [logs]=\"logs()\"\n [feedingSettings]=\"feedingSettings()\"\n [now]=\"now()\"\n [nutritionTarget]=\"nutritionTarget()\"\n [user]=\"user()\"\n [syncMessage]=\"syncMessage()\"\n [syncError]=\"syncError()\"\n [logDialogOpen]=\"logDialogOpen()\"\n [loadingLogs]=\"loadingLogs()\"\n [refreshToken]=\"dailyRefreshToken()\"\n (logsChanged)=\"onFeedingLogsChanged()\"\n (bottlePrepChange)=\"bottlePrep.set($event)\"\n (editLog)=\"feedingDialogs.openEditDialog($event)\"\n (historyOpen)=\"feedingDialogs.openHistoryDialog($event.filter, $event.dateStr)\"\n (feedRowClick)=\"feedingDialogs.onFeedRowClick($event)\"\n >\n <app-feeding-charts\n data-feeding-charts\n [logs]=\"logs()\"\n [now]=\"now()\"\n [nutritionTarget]=\"nutritionTarget()\"\n />\n </app-feeding-daily>\n <app-feeding-nutrition\n [nutritionTarget]=\"nutritionTarget()\"\n [todayStats]=\"todayStats()\"\n [now]=\"now()\"\n [latestWeightKg]=\"latestWeightKgFromSheet()\"\n [editing]=\"editing()\"\n (goToWeight)=\"setBottomTab('weight')\"\n />\n }\n\n <!-- ============ FAB (add feeding log) ============ -->\n @if (profile() && !editing()) {\n <button\n type=\"button\"\n class=\"fab\"\n (click)=\"feedingDialogs.openLogDialog()\"\n aria-label=\"Ghi nh\u1EADn c\u1EEF b\u00FA\"\n title=\"Ghi nh\u1EADn c\u1EEF b\u00FA m\u1EDBi\"\n >\n <i class=\"pi pi-plus\"></i>\n <span class=\"fab-label\">Ghi c\u1EEF b\u00FA</span>\n </button>\n }\n </div>\n <!-- /.tab-pane--feeding -->\n </main>\n </div>\n <!-- /.feeding-page -->\n\n <!-- ============ BOTTOM NAVIGATION ============ -->\n <nav\n class=\"bottom-nav\"\n role=\"tablist\"\n aria-label=\"\u0110i\u1EC1u h\u01B0\u1EDBng ch\u00EDnh\"\n [style.--bn-cols]=\"navTabs().length\"\n [style.--active-index]=\"activeTabIndex()\"\n >\n @for (tab of navTabs(); track tab.id) {\n <button\n type=\"button\"\n class=\"bn-item\"\n role=\"tab\"\n [attr.aria-selected]=\"bottomTab() === tab.id\"\n [class.active]=\"bottomTab() === tab.id\"\n (click)=\"setBottomTab(tab.id)\"\n >\n <span class=\"bn-icon-wrap\">\n <i class=\"pi {{ tab.icon }} bn-icon\" aria-hidden=\"true\"></i>\n </span>\n <span class=\"bn-label\">{{ tab.label }}</span>\n </button>\n }\n </nav>\n\n <!-- About -->\n @if (aboutDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeAboutDialog()\">\n <div\n class=\"dialog about-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby=\"feeding-about-title\"\n (click)=\"$event.stopPropagation()\"\n >\n <div class=\"dialog-head about-dialog__head\">\n <h2 id=\"feeding-about-title\" class=\"about-dialog__title\">\n <i class=\"pi pi-info-circle\" aria-hidden=\"true\"></i>\n About\n </h2>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeAboutDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <dl class=\"about-dialog__meta\">\n <div class=\"about-dialog__row\">\n <dt>\u1EE8ng d\u1EE5ng</dt>\n <dd>{{ appInfo.name }}</dd>\n </div>\n <div class=\"about-dialog__row\">\n <dt>Phi\u00EAn b\u1EA3n</dt>\n <dd>\n <code>{{ appInfo.version }}</code>\n </dd>\n </div>\n </dl>\n <div class=\"dialog-actions\">\n <button type=\"button\" class=\"btn primary\" (click)=\"closeAboutDialog()\">\u0110\u00F3ng</button>\n </div>\n </div>\n </div>\n }\n\n <!-- Nh\u1EAFc s\u1EF1 ki\u1EC7n l\u1ECBch (sheet Event + Settings) -->\n @if (eventReminderDialogOpen() && scheduleReminderEvents().length > 0) {\n <div\n class=\"dialog-overlay dialog-overlay--front dialog-overlay--event-reminder\"\n (click)=\"closeEventReminderDialog()\"\n >\n <div\n class=\"dialog event-reminder-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n (click)=\"$event.stopPropagation()\"\n >\n <div class=\"dialog-head event-reminder-dialog__head\">\n <h2 class=\"event-reminder-dialog__title\">\n <i class=\"pi pi-bell\" aria-hidden=\"true\"></i>\n B\u1EA1n c\u00F3 l\u1ECBch s\u1EAFp t\u1EDBi\n </h2>\n <button\n type=\"button\"\n class=\"dialog-close\"\n (click)=\"closeEventReminderDialog()\"\n aria-label=\"\u0110\u00F3ng\"\n >\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <ul class=\"event-reminder-list\">\n @for (ev of scheduleReminderEvents(); track ev) {\n <li>\n <article class=\"event-reminder-card\">\n <h3 class=\"event-reminder-card__title\">{{ ev.title }}</h3>\n <p class=\"event-reminder-card__datetime\">\n <span class=\"event-reminder-card__date\">{{ formatReminderEventWhen(ev) }}</span>\n <span class=\"event-reminder-card__sep\" aria-hidden=\"true\"> \u2013 </span>\n <span class=\"event-reminder-card__hour\">{{\n formatReminderEventTime(ev.time)\n }}</span>\n </p>\n @if (ev.place) {\n <p class=\"event-reminder-card__place\">\n <i class=\"pi pi-map-marker\" aria-hidden=\"true\"></i>\n <span>{{ ev.place }}</span>\n </p>\n }\n @if (ev.note) {\n <div class=\"event-reminder-card__content-wrap\">\n <span class=\"event-reminder-card__content-label\">N\u1ED9i dung</span>\n <p class=\"event-reminder-card__content\">{{ ev.note }}</p>\n </div>\n }\n </article>\n </li>\n }\n </ul>\n <div class=\"dialog-actions event-reminder-actions\">\n <button\n type=\"button\"\n class=\"event-reminder-actions__link\"\n (click)=\"acknowledgeAllEventReminders()\"\n >\n Kh\u00F4ng nh\u1EAFc l\u1EA1i\n </button>\n <button\n type=\"button\"\n class=\"btn primary event-reminder-actions__primary\"\n (click)=\"skipEventReminderSession()\"\n >\n \u0110\u00E3 hi\u1EC3u\n </button>\n </div>\n </div>\n </div>\n }\n\n <app-feeding-dialogs\n #feedingDialogs\n [logs]=\"logs()\"\n [user]=\"user()\"\n [now]=\"now()\"\n [bottlePrep]=\"bottlePrep()\"\n [feedingSettings]=\"feedingSettings()\"\n [prediction]=\"prediction()\"\n [todayStats]=\"todayStats()\"\n [yesterdayStats]=\"yesterdayStats()\"\n [todayLogs]=\"todayLogs()\"\n [yesterdayLogs]=\"yesterdayLogs()\"\n [maxBirthDate]=\"maxBirthDate\"\n [syncError]=\"syncError()\"\n [syncMessage]=\"syncMessage()\"\n (logsChanged)=\"onFeedingLogsChanged()\"\n (settingsChanged)=\"onFeedingSettingsChanged($event)\"\n (syncErrorChange)=\"syncError.set($event)\"\n (syncMessageChange)=\"syncMessage.set($event)\"\n (logDialogOpenChange)=\"logDialogOpen.set($event)\"\n (bottlePrepClearRequested)=\"clearBottlePrep()\"\n />\n</div>\n<!-- /.feeding-root -->\n", styles: ["@charset \"UTF-8\";:host{display:flex;flex-direction:column;position:absolute;inset:0;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--border-strong: #d1d5db;--primary: #5b6cff;--primary-2: #4c5cf0;--primary-soft: #eef0ff;--accent: #ff5c8a;--accent-soft: #ffe7ef;--mint: #10b981;--mint-soft: #d1fae5;--amber: #f59e0b;--amber-soft: #fef3c7;--rose: #ef4444;--rose-soft: #fee2e2;--text: #0f172a;--muted: #64748b;--muted-2: #94a3b8}.feeding-root{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;position:relative}.feeding-root .bp-prep-user{font-weight:800;color:#0369a1;background:#0ea5e933;padding:0 5px;margin-right:2px;border-radius:5px;white-space:nowrap;transition:color .2s,background .2s}.feeding-root .bp-prep-time{font-weight:800;font-variant-numeric:tabular-nums;color:#0284c7;background:linear-gradient(180deg,#f0f9ff,#e0f2fe);border:1px solid rgba(14,165,233,.35);padding:1px 7px;margin-left:2px;border-radius:6px;white-space:nowrap;box-shadow:0 1px #ffffffa6 inset;transition:color .2s,background .2s,border-color .2s}.feeding-page{position:relative;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;color:var(--text);padding-bottom:calc(170px + env(safe-area-inset-bottom,0px))}.backdrop{position:fixed;inset:0;background:var(--bg);z-index:-1}.hero-notif-wrap{padding:0 16px 8px}.hero{padding:0;background:#fffffff5;border-bottom:1px solid rgba(226,232,240,.9)}@media(max-width:640px){.hero{padding-top:calc(26px + env(safe-area-inset-top,0px));padding-bottom:10px}}.hero-inner{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 18px}.hero-brand{min-width:0}.hero-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;width:100%}.hero-title{display:flex;align-items:center;gap:12px;min-width:0;flex:1}.hero-title .emoji{font-size:36px;line-height:1;flex-shrink:0;filter:drop-shadow(0 2px 4px rgba(15,23,42,.08))}@media(max-width:640px){.hero-title .emoji{font-size:32px}}.hero-title .hero-text{min-width:0}.hero-title h1{margin:0;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.02em;line-height:1.2}@media(max-width:640px){.hero-title h1{font-size:17px}}.hero-title .hero-userline{margin:5px 0 0;display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 6px;font-size:12.5px;color:var(--muted)}.hero-title .hero-userline i{font-size:12px;color:var(--primary);opacity:.9}.hero-title .hero-userline strong{color:var(--primary);font-weight:700;letter-spacing:.01em}.hero-title .hero-userline .hero-last-update{font-size:11px;color:#94a3b8;font-weight:400}.hero--profile-merged{background:var(--primary-soft);padding-bottom:10px;margin-bottom:8px}.hero-title--merged{align-items:flex-start}.hero-title--merged .emoji{font-size:30px}.hero-title--merged h1{font-size:18px;line-height:1.15}.hero-merged-head{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;min-width:0;row-gap:6px}.hero-age-chip{font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:lowercase;color:var(--primary);background:var(--primary-soft);padding:3px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--primary) 18%,transparent);white-space:nowrap}.hero-merged-stat{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:6px;font-size:11px;font-weight:700;color:var(--muted);background:#94a3b824;border:1px solid rgba(148,163,184,.28);white-space:nowrap;line-height:1.25}.hero-merged-stat>i{font-size:10px;opacity:.88;color:var(--muted-2)}.hero-merged-stat--weight>i{color:var(--accent);opacity:1}.hero-merged-meta{margin:5px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:2px 4px;font-size:11.5px;line-height:1.45;color:var(--muted)}.hero-merged-meta .dot{color:var(--muted-2);font-weight:700;-webkit-user-select:none;user-select:none}.hero-merged-meta i{font-size:10px;margin-right:3px;color:var(--muted-2);opacity:.95}.hero-merged-meta strong{color:var(--primary);font-weight:700}.hero-merged-sync{color:#94a3b8;font-weight:400;font-size:11px}.hero-actions--merged{flex-shrink:0}.hero-profile-menu{position:relative;flex:0 0 auto;list-style:none}.hero-profile-menu__trigger{list-style:none}.hero-profile-menu__trigger::-webkit-details-marker{display:none}.hero-profile-menu__trigger::marker{content:\"\"}.hero-profile-menu__panel{position:absolute;top:calc(100% + 6px);right:0;z-index:30;min-width:180px;padding:6px;border-radius:12px;border:1px solid var(--border);background:#fff;box-shadow:0 8px 24px -8px #0f172a2e}.hero-profile-menu__item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:8px;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--text);text-align:left;cursor:pointer;transition:background .12s ease,color .12s ease}.hero-profile-menu__item i{font-size:14px;color:var(--muted-2);width:1.1em;text-align:center}.hero-profile-menu__item:hover:not(:disabled){background:var(--primary-soft, #eef0ff);color:var(--primary)}.hero-profile-menu__item:hover:not(:disabled) i{color:var(--primary)}.hero-profile-menu__item--danger:hover:not(:disabled){color:var(--rose);background:var(--rose-soft)}.hero-profile-menu__item--danger:hover:not(:disabled) i{color:var(--rose)}.about-dialog{max-width:360px}.about-dialog__head{margin-bottom:8px}.about-dialog__title{display:flex;align-items:center;gap:8px;margin:0;font-size:18px;font-weight:700}.about-dialog__title i{color:var(--primary)}.about-dialog__meta{margin:0 0 16px;padding:0}.about-dialog__row{display:grid;grid-template-columns:96px 1fr;gap:8px 12px;padding:10px 0;border-bottom:1px solid var(--border)}.about-dialog__row:last-child{border-bottom:0}.about-dialog__row dt{margin:0;font-size:13px;font-weight:600;color:var(--muted-2)}.about-dialog__row dd{margin:0;font-size:14px;font-weight:600;color:var(--text)}.about-dialog__row dd code{font-size:13px;font-weight:600;padding:2px 8px;border-radius:6px;background:var(--primary-soft, #eef0ff);color:var(--primary)}@media(max-width:640px){.hero-title--merged .emoji{font-size:26px}.hero-merged-meta{font-size:11px}.hero-merged-stat{font-size:10.5px;padding:2px 7px}}.hero-datetime{display:flex;flex-wrap:wrap;align-items:center;flex-shrink:0}.hero-datetime-strip{display:inline-flex;align-items:stretch;flex-wrap:nowrap;max-width:100%;min-height:34px;border:1px solid var(--border);border-radius:8px;background:linear-gradient(180deg,#fff,#f1f5f9);box-shadow:0 1px 1px #0f172a0d}.hero-datetime-strip__block{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;min-width:0}.hero-datetime-strip__block>.pi{font-size:12px;color:var(--primary);opacity:.82;flex-shrink:0}.hero-datetime-strip__block--date{flex-wrap:wrap;row-gap:0}.hero-datetime-strip__wd{font-size:10px;font-weight:700;color:var(--muted);text-transform:capitalize;letter-spacing:.02em;line-height:1.15;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero-datetime-strip__date{font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--text);letter-spacing:.02em;white-space:nowrap}.hero-datetime-strip__divider{align-self:stretch;width:1px;margin:5px 0;background:#94a3b866;flex-shrink:0}.hero-datetime-strip__clock{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.04em;color:var(--primary);line-height:1;white-space:nowrap}.hero-datetime-strip__block--time{padding-right:10px}.hero-datetime-strip__block--time>.pi{font-size:11px}@media(max-width:520px){.hero-inner{flex-direction:column;align-items:stretch}.hero-datetime{width:100%;justify-content:flex-start}.hero-datetime-strip{flex:1 1 auto;width:100%;justify-content:space-between}.hero-notification__composer-row{flex-direction:column;align-items:stretch}.hero-notification__send,.hero-notification__cancel{width:100%;justify-content:center}}.hero-notification__bg-icon{position:absolute;pointer-events:none;color:var(--primary);opacity:.13;line-height:1}.hero-notification__bg-icon i{display:block}.hero-notification__bg-icon--bell{top:8%;left:6%;font-size:28px;transform:rotate(-18deg)}.hero-notification__bg-icon--megaphone{top:10%;right:8%;font-size:24px;transform:rotate(12deg)}.hero-notification__bg-icon--comments{bottom:14%;right:10%;font-size:22px;transform:rotate(-8deg)}.hero-notification__bg-icon--send{bottom:10%;left:50%;font-size:20px;transform:rotate(-22deg)}.hero-notification__bg-icon--star{bottom:16%;left:4%;font-size:18px;transform:rotate(20deg)}.hero-notification__bg-icon--bolt{top:46%;right:2%;font-size:20px;transform:rotate(-5deg)}.hero-notification__bg-icon--heart{top:38%;left:14%;font-size:17px;transform:rotate(15deg)}.hero-notification__bg-icon--info{top:4%;left:50%;font-size:18px;transform:rotate(0)}.hero-notification__bg-icon--check{bottom:24%;left:35%;font-size:17px;transform:rotate(8deg)}.hero-notification__bg-icon--eye{top:14%;left:28%;font-size:18px;transform:rotate(-10deg)}.hero-notification{flex:1 1 100%;display:flex;flex-direction:column;gap:10px;margin-top:2px;padding:10px 12px;border:1px solid rgba(148,163,184,.28);border-radius:14px;background:#fff;position:relative;overflow:hidden}.hero-notification__head{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative}.hero-notification__head-actions{display:inline-flex;align-items:center;gap:6px}.hero-notification__composer-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}.hero-notification__composer-label i{color:var(--primary);font-size:12px}.hero-notification__unread-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--primary);color:#fff;font-size:10px;font-weight:700;line-height:1}.hero-notification__add{width:28px;height:28px;border:1px solid rgba(var(--primary-rgb, 76, 92, 240),.25);border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.1);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}.hero-notification__add i{font-size:11px}.hero-notification__add:hover:not(:disabled){background:var(--primary);border-color:var(--primary);color:#fff}.hero-notification__mark-all{height:26px;border:none;border-radius:0;background:transparent;color:var(--primary);font-size:11px;font-weight:600;padding:0;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:4px}.hero-notification__mark-all i{font-size:10px}.hero-notification__mark-all:hover:not(:disabled){opacity:.75}.hero-notification__mark-all:disabled{color:var(--muted-2);cursor:default}.hero-notification__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;position:relative}.hero-notification__item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid #e2e8f0;position:relative;transition:border-color .18s ease,transform .18s ease}@media(hover:hover){.hero-notification__item:hover{border-color:#c7d2fe;transform:translateY(-1px)}}.hero-notification__avatar{width:34px;height:34px;border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.12);border:1.5px solid rgba(var(--primary-rgb, 76, 92, 240),.22);color:var(--primary);font-size:11px;font-weight:700;letter-spacing:.5px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.hero-notification__body{flex:1;min-width:0;padding-right:52px}.hero-notification__body-head{display:flex;align-items:center;gap:6px;margin-bottom:3px}.hero-notification__author{font-size:12px;font-weight:700;color:var(--text)}.hero-notification__content{margin:0;font-size:13.5px;line-height:1.5;color:var(--text);white-space:pre-wrap;word-break:break-word}.hero-notification__created{display:block;margin-top:4px;font-size:11px;color:#94a3b8;font-variant-numeric:tabular-nums}.hero-notification__item-actions{position:absolute;top:7px;right:8px;display:inline-flex;align-items:center;gap:4px}.hero-notification__ack-top{width:24px;height:24px;border:none;border-radius:50%;background:#eff6ff;color:#1d4ed8;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease}.hero-notification__ack-top i{font-size:10px}.hero-notification__ack-top:active:not(:disabled){transform:scale(.96)}.hero-notification__ack-top:hover:not(:disabled){background:#dbeafe;color:#1e40af}.hero-notification__delete{width:24px;height:24px;border:none;border-radius:50%;background:transparent;color:#94a3b8;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.hero-notification__delete i{font-size:10px}.hero-notification__delete:hover:not(:disabled){background:#fee2e2;color:#b91c1c}.hero-notification__empty{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 8px;position:relative}.hero-notification__empty-icon{font-size:28px;color:var(--primary);opacity:.45;margin-bottom:4px}.hero-notification__empty-title{font-size:13px;font-weight:600;color:var(--muted)}.hero-notification__empty-sub{font-size:11px;color:var(--muted-2);text-align:center}.hero-notification__more{align-self:flex-start;border:none;background:transparent;color:var(--primary);font-size:12px;font-weight:700;cursor:pointer;padding:0;font-family:inherit;position:relative}.hero-notification__more:hover{opacity:.75}.hero-notification__composer-row{display:flex;align-items:stretch;gap:8px;min-width:0}.hero-notification__composer-panel{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid #dbe4f3;border-radius:12px;background:#f8fbff}.hero-notification__input-wrap{flex:1;min-width:0;border-radius:11px;border:1.5px solid #cfd8e6;background:#fff;transition:border-color .15s ease;position:relative}.hero-notification__composer-row:focus-within .hero-notification__input-wrap{border-color:var(--primary)}.hero-notification__input{width:100%;min-width:0;min-height:100px;border:0;border-radius:11px;padding:10px 12px 32px;font-size:13px;line-height:1.45;color:var(--text);background:transparent;font-family:inherit;resize:vertical}.hero-notification__input:focus{outline:none}.hero-notification__char-ring{position:absolute;bottom:8px;right:10px;display:flex;align-items:center;gap:4px;pointer-events:none}.hero-notification__char-ring svg{width:22px;height:22px;transform:rotate(-90deg)}.hero-notification__char-ring-track{fill:none;stroke:#e2e8f0;stroke-width:3}.hero-notification__char-ring-fill{fill:none;stroke:var(--primary);stroke-width:3;stroke-dasharray:94 94;stroke-linecap:round;transition:stroke-dashoffset .2s ease}.hero-notification__char-count{font-size:10px;color:var(--muted-2);font-variant-numeric:tabular-nums}.hero-notification__composer-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.hero-notification__send,.hero-notification__cancel{height:36px;border-radius:10px;min-width:86px;padding:0 14px;font-size:12px;font-weight:700}.hero-notification__send{background:var(--primary);color:#fff}.hero-notification__send:not(:disabled):hover{background:var(--primary-2)}.hero-notification__cancel{min-width:72px}.hero-notification__error{margin:0;font-size:12px;color:#b91c1c;position:relative}.hero-notification-dialog{max-width:min(520px,100vw - 24px);overflow:hidden}.hero-notification-dialog .hero-notification__composer-row{align-items:stretch;gap:10px}.hero-notification-dialog .hero-notification__input-wrap{min-height:110px}.hero-notification-dialog__head{margin-bottom:14px}.hero-notification-dialog__title-group{display:flex;align-items:flex-start;gap:10px}.hero-notification-dialog__icon-wrap{width:34px;height:34px;border-radius:10px;background:rgba(var(--primary-rgb, 76, 92, 240),.12);border:1px solid rgba(var(--primary-rgb, 76, 92, 240),.22);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.hero-notification-dialog__icon-wrap i{font-size:14px}.hero-notification-dialog__title{margin:0;font-size:15px;font-weight:800;color:var(--text);line-height:1.3}.hero-notification-dialog__subtitle{margin:2px 0 0;font-size:11px;color:var(--muted-2)}.hero-notification-list-dialog{max-width:min(620px,100vw - 24px)}.hero-notification-list-dialog__head{margin-bottom:10px;align-items:flex-start}.hero-notification-list-dialog__head-actions{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}.hero-notification-list-dialog__title{margin:0;font-size:15px;font-weight:800;color:var(--text);line-height:1.3}.hero-notification-list-dialog__body{max-height:min(60vh,480px);overflow-y:auto;padding-right:2px}.ack-all-confirm-dialog{max-width:min(380px,100vw - 24px);text-align:center;padding:28px 24px 24px;display:flex;flex-direction:column;align-items:center;gap:10px;overflow:hidden}.ack-all-confirm-dialog__icon-wrap{width:52px;height:52px;border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.1);border:1.5px solid rgba(var(--primary-rgb, 76, 92, 240),.2);color:var(--primary);display:flex;align-items:center;justify-content:center;margin-bottom:2px}.ack-all-confirm-dialog__icon-wrap i{font-size:22px}.ack-all-confirm-dialog__title{margin:0;font-size:16px;font-weight:800;color:var(--text)}.ack-all-confirm-dialog__desc{margin:0;font-size:13px;color:var(--muted);line-height:1.55;max-width:280px}.ack-all-confirm-dialog__actions{display:flex;gap:10px;margin-top:6px;width:100%;justify-content:center}.ack-all-confirm-dialog__actions .btn{min-width:96px;height:38px;border-radius:10px;font-size:13px;font-weight:700}.ack-all-confirm-dialog__confirm-btn{background:var(--primary);color:#fff;display:inline-flex;align-items:center;gap:6px}.ack-all-confirm-dialog__confirm-btn i{font-size:12px}.ack-all-confirm-dialog__confirm-btn:not(:disabled):hover{background:var(--primary-2)}.hero-actions{display:flex;gap:8px;align-items:center;flex-shrink:0;align-self:center}.content{width:100%}.content .tab-pane[hidden]{display:none!important}.content .tab-pane--feeding{max-width:1100px;margin:0 auto;padding:0 20px}.content .tab-pane--documents{max-width:none;padding:0}.content .tab-pane--weight{max-width:none;padding:0;background:linear-gradient(180deg,color-mix(in srgb,var(--primary, #5b6cff) 5%,var(--surface, #fff)) 0%,var(--surface, #fff) min(36vh,280px),var(--surface, #fff) 100%)}.content .tab-pane--mom{max-width:1100px;margin:0 auto;padding:0 20px calc(24px + env(safe-area-inset-bottom,0px))}.content .tab-pane--medical{max-width:none;padding:0;background:linear-gradient(180deg,color-mix(in srgb,var(--primary, #5b6cff) 7%,var(--surface, #fff)) 0%,var(--surface, #fff) min(42vh,320px),var(--surface, #fff) 100%)}.bottom-nav{--bn-primary: #5b6cff;--bn-primary-rgb: 91, 108, 255;--bn-inactive: #b0b7c3;--bn-height: 62px;left:0;right:0;bottom:0;width:100%;box-sizing:border-box;z-index:90;position:fixed;display:grid;grid-template-columns:repeat(var(--bn-cols, 5),1fr);align-items:center;min-height:var(--bn-height);padding:0 4px;background:#fffffff5;backdrop-filter:blur(24px) saturate(200%);-webkit-backdrop-filter:blur(24px) saturate(200%);border-top:1px solid rgba(0,0,0,.055);box-shadow:0 -4px 24px -4px #0f172a14}.bottom-nav:before{content:\"\";position:absolute;top:50%;margin-top:0;width:calc(100% / var(--bn-cols, 5));height:48px;left:calc(var(--active-index, 0) * 100% / var(--bn-cols, 5));transform:translateY(-50%);transition:left .32s cubic-bezier(.65,0,.35,1);pointer-events:none;z-index:0;border-radius:16px;background:linear-gradient(145deg,rgba(var(--bn-primary-rgb),.14),rgba(var(--bn-primary-rgb),.06));margin-left:6px;width:calc(100% / var(--bn-cols, 5) - 12px)}.bottom-nav .bn-item{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:var(--bn-height);padding:0 2px;background:transparent;border:none;color:var(--bn-inactive);cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;transition:color .22s ease}.bottom-nav .bn-item .bn-icon-wrap{display:flex;align-items:center;justify-content:center;width:32px;height:30px;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.bottom-nav .bn-item .bn-icon{font-size:21px;line-height:1;transition:filter .22s ease;display:block}.bottom-nav .bn-item .bn-label{font-size:10px;font-weight:500;letter-spacing:.025em;line-height:1;transition:font-weight .22s ease}.bottom-nav .bn-item:not(.active):hover{color:rgba(var(--bn-primary-rgb),.7)}.bottom-nav .bn-item:active .bn-icon-wrap{transform:scale(.88)}.bottom-nav .bn-item.active{color:var(--bn-primary)}.bottom-nav .bn-item.active .bn-icon-wrap{transform:translateY(-3px) scale(1.15)}.bottom-nav .bn-item.active .bn-icon{filter:drop-shadow(0 2px 8px rgba(var(--bn-primary-rgb),.4))}.bottom-nav .bn-item.active .bn-label{font-weight:700}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:16px}.card-header{margin-bottom:16px}.card-header h2{margin:0;font-size:18px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:8px}.card-header h2 i{color:var(--primary)}.card-header p{margin:6px 0 0;color:var(--muted);font-size:13px}.eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted-2);letter-spacing:.06em}.eyebrow i{margin-right:4px}.form{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field .label{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.field .label .label-hint{font-size:11px;font-weight:500;color:var(--muted-2);font-style:italic;text-transform:none;letter-spacing:0}.field input[type=text],.field input[type=date],.field input[type=time],.field input[type=number]{padding:12px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:14px;font-family:inherit;color:var(--text);background:#fafbfc;width:100%;min-width:0;box-sizing:border-box;appearance:none;-webkit-appearance:none;transition:border-color .15s,background .15s;min-height:46px;font-variant-numeric:tabular-nums}.field input[type=text]:focus,.field input[type=date]:focus,.field input[type=time]:focus,.field input[type=number]:focus{outline:none;border-color:var(--primary);background:#fff}.field input[type=text]::placeholder,.field input[type=date]::placeholder,.field input[type=time]::placeholder,.field input[type=number]::placeholder{color:var(--muted-2)}.field input[type=number]{-moz-appearance:textfield}.field input[type=number]::-webkit-outer-spin-button,.field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.radio-group{display:flex;gap:8px;flex-wrap:wrap}.chip{padding:9px 16px;border:1.5px solid var(--border);background:#fff;border-radius:999px;font-size:13px;cursor:pointer;color:var(--text);transition:all .15s;font-family:inherit}.chip:hover{border-color:var(--primary);color:var(--primary)}.chip.active{background:var(--primary);border-color:var(--primary);color:#fff}.form-actions{display:flex;gap:10px;margin-top:4px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border:none;border-radius:10px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.small{padding:6px 12px;font-size:12px}.btn.primary{background:var(--primary);color:#fff}.btn.primary:not(:disabled):hover{background:var(--primary-2)}.btn.ghost{background:transparent;color:var(--muted);border:1.5px solid var(--border)}.btn.ghost:hover{color:var(--text);border-color:var(--border-strong)}.btn.danger-ghost{background:transparent;color:var(--rose);border:1.5px solid var(--rose-soft)}.btn.danger-ghost:hover{background:var(--rose-soft)}.btn.icon-btn{padding:0;width:36px;height:36px;justify-content:center;background:transparent;color:var(--muted);border:1.5px solid var(--border);border-radius:10px}.btn.icon-btn i{font-size:14px}.btn.icon-btn:not(:disabled):hover{color:var(--primary);border-color:var(--primary);background:var(--primary-soft)}.btn.icon-btn .spin{animation:spin-refresh .9s linear infinite}@keyframes spin-refresh{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.age-stats{display:flex;align-items:baseline;justify-content:flex-start;gap:16px;padding:14px 16px;background:var(--primary-soft);border-radius:12px}.age-stats .stat{text-align:center}.age-stats .stat .num{font-size:26px;font-weight:700;color:var(--primary);line-height:1;font-variant-numeric:tabular-nums}.age-stats .stat .unit{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-top:3px}.age-stats .dot{color:var(--muted-2);font-size:20px}.period-card{margin-bottom:0}.period-card h2{margin:6px 0 8px;font-size:20px;font-weight:700}.period-card .period-summary{color:var(--muted);font-size:14px;margin:0 0 14px;line-height:1.55}.schedule-grid{display:grid;grid-template-columns:1fr;gap:10px}.schedule{display:flex;gap:12px;padding:12px;background:#fafbfc;border:1px solid var(--border);border-radius:12px}.schedule i{color:var(--primary);font-size:18px;margin-top:2px}.schedule .schedule-title{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}.schedule .schedule-text{font-size:14px;color:var(--text);line-height:1.5}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}@media(max-width:768px){.compare-grid{grid-template-columns:1fr}}.day-card{margin-bottom:0;min-width:0;overflow:hidden}.day-card.today{border-color:#3b82f6;background:linear-gradient(180deg,#dbeafe,#fff 50%)}.day-card.yesterday{background:#fafbfc}.day-date-nav-wrap{position:relative;margin-bottom:12px}.day-date-nav-reset{position:absolute;top:-8px;right:-8px;z-index:1;width:24px;height:24px;border:1px solid var(--border);border-radius:50%;background:#fff;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:0 1px 3px #0f172a14}.day-date-nav-reset i{font-size:10px}.day-date-nav-reset:hover{background:#fee2e2;border-color:#fecaca;color:#dc2626}.day-date-nav-reset:active{background:#fee2e2;color:#dc2626}.day-date-strip{display:grid;grid-template-columns:32px 1fr 32px;gap:6px;align-items:stretch;padding:6px 8px;border-radius:10px;background:#fff;border:1px solid var(--border);touch-action:manipulation}.day-date-strip-scroller{display:flex;gap:4px;min-width:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding:1px 2px}.day-date-strip-scroller::-webkit-scrollbar{height:4px}.day-date-strip-scroller::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}.day-date-strip-day{flex:0 0 64px;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;padding:6px 4px;border:1px solid transparent;border-radius:8px;background:#f8fafc;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.day-date-strip-day:hover{background:#eef2ff;border-color:#c7d2fe}.day-date-strip-day.active{background:#dbeafe;border-color:#3b82f6;box-shadow:inset 0 0 0 1px #3b82f626}.day-date-strip-date{font-size:12px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2}.day-date-strip-ml{font-size:11px;font-weight:600;color:#1d4ed8;font-variant-numeric:tabular-nums;line-height:1.2}.day-date-strip-ml.empty{color:var(--muted);font-weight:500}.day-date-strip-arrow{width:32px;min-height:52px;flex-shrink:0;border:none;border-radius:8px;background:#f1f5f9;color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.day-date-strip-arrow i{font-size:12px}.day-date-strip-arrow:hover:not(:disabled){background:var(--primary);color:#fff}.day-date-strip-arrow:active:not(:disabled){background:var(--primary);color:#fff}.day-date-strip-arrow:disabled{opacity:.35;cursor:not-allowed}.day-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.day-head h3{margin:4px 0 0;font-size:16px;color:var(--text);font-variant-numeric:tabular-nums}.big-total{display:flex;align-items:baseline;gap:3px}.big-total .num{font-size:32px;font-weight:800;color:var(--text);line-height:1;font-variant-numeric:tabular-nums}.big-total .unit{font-size:14px;color:var(--muted);font-weight:500}.day-stats{display:flex;flex-wrap:wrap;gap:10px 16px;padding:10px 0 0;border-top:1px solid var(--border)}.day-stats>div{font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:5px}.day-stats>div i{color:var(--primary);font-size:12px}.compare-banner{margin-top:12px;padding:12px;background:var(--primary-soft);border-radius:12px;font-size:12px;color:var(--text);display:flex;flex-direction:column;gap:8px}.compare-banner strong{color:var(--primary);font-variant-numeric:tabular-nums;font-weight:700}.compare-banner .compare-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.compare-banner .compare-row:not(:last-child){padding-bottom:8px;border-bottom:1px dashed rgba(15,23,42,.1)}.compare-banner .compare-stats{display:flex;align-items:center;gap:6px;flex:1}.compare-banner .compare-stats .label{color:var(--muted);font-weight:500;font-size:11px}.compare-banner .compare-stats .count{color:var(--muted-2);font-size:11px}.compare-banner .compare-change{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;flex-shrink:0}.compare-banner .compare-change i{font-size:10px}.compare-banner .compare-change i.up{color:var(--mint)}.compare-banner .compare-change i.down{color:var(--amber)}.compare-banner .compare-change strong{font-size:12px}.compare-banner .compare-change span{color:var(--muted-2);font-weight:500}.today-logs{margin-top:12px;padding:12px;background:#fafbfc;border:1px solid var(--border);border-radius:12px}.logs-header{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}.logs-header span{display:flex;align-items:center;gap:6px}.logs-header span:before{content:\"\\1f37c\";font-size:14px}.logs-header .logs-more{text-transform:none;letter-spacing:0;background:transparent;border:none;color:var(--primary);font-size:12px;font-weight:600;padding:4px 8px;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;gap:3px;transition:background .2s ease}.logs-header .logs-more i{font-size:10px}.logs-header .logs-more:hover{background:var(--primary-soft)}.log-list{display:flex;flex-direction:column;gap:6px;min-width:0}.log-row{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#fafbfc;border-radius:8px;font-size:13px;min-width:0;max-width:100%;transition:all .2s ease;position:relative}.log-row.low-volume .log-volume{color:#f59e0b;font-weight:900}.log-row.high-volume .log-volume{color:#10b981;font-weight:900}.log-row:hover{background:#f1f5f9;transform:translateY(-1px);box-shadow:0 2px 8px #0000000d}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.log-time{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;min-width:42px}.log-volume{font-weight:800;color:var(--primary);font-size:16px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.log-gap{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;background:#f3f4f6;color:#6b7280;border-radius:999px;font-size:10.5px;font-weight:600;white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums;transition:all .2s ease}.log-gap i{font-size:9px;opacity:.7}.log-gap.feed-gap-warn{background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-weight:700;border:1px solid rgba(234,88,12,.45);box-shadow:0 0 0 1px #fff3 inset,0 2px 8px #ea580c59}.log-gap.feed-gap-warn i{opacity:.95;color:inherit}.log-note{color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.log-actions{margin-left:auto;display:inline-flex;align-items:center;gap:2px}.log-edit,.log-del{background:transparent;border:none;color:var(--muted-2);cursor:pointer;padding:4px 6px;border-radius:6px;font-size:12px;transition:all .2s ease}.log-edit:hover{color:var(--primary);background:var(--primary-soft)}.log-del:hover{color:var(--rose);background:var(--rose-soft)}.empty-mini{padding:12px;text-align:center;color:var(--muted-2);font-size:13px;font-style:italic}.countdown-hero{display:flex;flex-direction:column;gap:16px;padding:18px 20px;background:#fff;border-radius:16px;border:1px solid #e6e9ff;transition:all .3s ease;margin-bottom:20px}.countdown-hero .hero-main{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:20px}.countdown-hero .feeding-time-card{flex:1;min-width:0;text-align:center}.countdown-hero .feeding-time-card .time-header{margin-bottom:12px;display:flex;justify-content:center}.countdown-hero .feeding-time-card .time-header .status-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:6px 12px;border-radius:14px;white-space:nowrap}.countdown-hero .feeding-time-card .time-header .status-badge i{font-size:11px}.countdown-hero .feeding-time-card .time-header .status-badge.status-waiting{background:var(--primary-soft);color:var(--primary)}.countdown-hero .feeding-time-card .time-header .status-badge.status-now{background:#fee2e2;color:#dc2626;animation:pulse-gentle 2s ease-in-out infinite;font-size:11px;text-transform:none;font-weight:700}.countdown-hero .feeding-time-card .time-header .status-badge.status-late{background:var(--rose-soft);color:var(--rose)}.countdown-hero .feeding-time-card .time-display .predicted-time{font-size:42px;font-weight:800;line-height:1;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin-bottom:4px}.countdown-hero .feeding-time-card .time-display .time-remaining{font-size:15px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}.countdown-hero .countdown-next{display:flex;flex-direction:column;gap:8px;padding-left:16px;border-left:1px dashed #d8dcff;flex-shrink:0;min-width:0}.countdown-hero .next-item{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.countdown-hero .next-item i{color:var(--primary);font-size:13px}.countdown-hero .next-item strong{font-weight:700}.countdown-hero .next-item .predict-label,.countdown-hero .next-item .recommend-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);margin-left:4px}.countdown-hero .next-item .recommend-label{color:var(--mint)}.countdown-hero .volume-info{display:flex;flex-direction:column;gap:8px;padding-left:20px;border-left:1px dashed #d8dcff;flex-shrink:0;min-width:160px;transition:all .3s ease}.countdown-hero .volume-info .volume-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.countdown-hero .volume-info .volume-row .volume-prefix{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);flex-shrink:0}.countdown-hero .volume-info .volume-row .volume-amount{font-size:22px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1;text-align:right}.countdown-hero .volume-info .volume-row.predicted-row .volume-prefix,.countdown-hero .volume-info .volume-row.predicted-row .volume-amount{color:var(--primary)}.countdown-hero .volume-info .volume-row.recommended-row .volume-prefix,.countdown-hero .volume-info .volume-row.recommended-row .volume-amount{color:var(--mint)}.countdown-hero[data-status=waiting]{border-color:#bbf7d0;background:linear-gradient(135deg,#f7fef8,#f0fdf4)}.countdown-hero[data-status=waiting] .feeding-time-card .time-display .predicted-time{color:#16a34a}.countdown-hero[data-status=waiting] .feeding-time-card .time-display .time-remaining{color:#15803d}.countdown-hero[data-status=waiting] .feeding-time-card .status-badge.status-waiting{background:#dcfce7!important;color:#15803d!important;border:1px solid #86efac}.countdown-hero[data-status=waiting] .volume-info .volume-amount{color:#16a34a}.countdown-hero[data-status=waiting] .volume-info .volume-prefix{color:#15803d}.countdown-hero[data-status=late]{border-color:#fca5a5;background:linear-gradient(135deg,#fef2f2,#fee2e2)}.countdown-hero[data-status=late] .feeding-time-card .time-display .predicted-time{color:#dc2626}.countdown-hero[data-status=late] .feeding-time-card .time-display .time-remaining{color:#b91c1c}.countdown-hero[data-status=late] .feeding-time-card .status-badge.status-late{background:#fee2e2;color:#dc2626;border:1px solid #fca5a5}.countdown-hero[data-status=late] .volume-info .volume-amount{color:#dc2626}.countdown-hero[data-status=late] .volume-info .volume-prefix{color:#b91c1c}.countdown-hero[data-status=now]{border-color:#fbbf24;background:linear-gradient(135deg,#fefce8,#fef3c7);animation:pulse-card 2s ease-in-out infinite}.countdown-hero[data-status=now] .feeding-time-card .time-display .predicted-time{color:#92400e}.countdown-hero[data-status=now] .feeding-time-card .time-display .time-remaining{color:#a16207}.countdown-hero[data-status=now] .feeding-time-card .status-badge.status-now{background:#fef3c7!important;color:#b45309!important;border:1px solid #f59e0b!important}.countdown-hero[data-status=now] .volume-info .volume-amount{color:#92400e}.countdown-hero[data-status=now] .volume-info .volume-prefix{color:#a16207}@media(max-width:540px){.countdown-hero .hero-main{flex-direction:column;align-items:stretch;gap:12px}.countdown-hero .hero-main .volume-info{border-left:none;border-top:1px dashed #d8dcff;padding-left:0;padding-top:12px;min-width:auto}.countdown-hero .hero-main .volume-info .volume-row{justify-content:space-between;padding:0 4px}.countdown-hero .hero-main .feeding-time-card .time-display .predicted-time{font-size:36px}.countdown-hero .hero-main .feeding-time-card .volume-info .volume-amount{font-size:20px}}@media(max-width:400px){.countdown-hero .feeding-time-card .status-badge{font-size:10px;padding:4px 10px}.countdown-hero .feeding-time-card .time-display .predicted-time{font-size:32px}.countdown-hero .volume-info .volume-amount{font-size:18px}}@keyframes pulse-soft{0%,to{opacity:1}50%{opacity:.65}}@keyframes pulse-gentle{0%,to{opacity:1}50%{opacity:.75}}@keyframes pulse-urgent{0%,to{opacity:1;text-shadow:0 0 0 rgba(239,68,68,0)}50%{opacity:.8;text-shadow:0 0 8px rgba(239,68,68,.25)}}@keyframes pulse-card{0%,to{transform:scale(1);box-shadow:0 1px 3px #0000001a,0 0 #f8717100}50%{transform:scale(1.02);box-shadow:0 4px 12px #00000026,0 0 0 2px #f871714d}}.burp-warning{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;margin:0 0 16px;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #f59e0b;border-radius:14px;box-shadow:0 2px 8px #f59e0b33;animation:burp-pulse 2s ease-in-out infinite}.burp-warning__icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#f59e0b;border-radius:50%;color:#fff;font-size:18px;animation:burp-icon-bounce 1.5s ease-in-out infinite}.burp-warning__content{flex:1;min-width:0}.burp-warning__title{font-size:15px;font-weight:700;color:#92400e;margin-bottom:4px}.burp-warning__text{font-size:13px;color:#78350f;line-height:1.5;margin-bottom:8px}.burp-warning__text strong{font-weight:600;color:#92400e}.burp-warning__countdown{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#ffffffb3;border-radius:8px;font-size:13px;color:#92400e;font-weight:500}.burp-warning__countdown i{font-size:14px;color:#f59e0b}.burp-warning__countdown strong{font-size:16px;font-weight:700;color:#d97706}@keyframes burp-pulse{0%,to{box-shadow:0 2px 8px #f59e0b33}50%{box-shadow:0 4px 16px #f59e0b59}}@keyframes burp-icon-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.countdown-progress{margin-top:10px}.countdown-progress .cp-track{position:relative;height:6px;background:#ffffffbf;border-radius:999px;overflow:hidden}.countdown-progress .cp-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:999px;transition:width .4s ease}.countdown-progress .cp-fill[data-status=waiting]{background:linear-gradient(90deg,#22c55e,#16a34a)}.countdown-progress .cp-fill[data-status=late]{background:linear-gradient(90deg,#f87171,#dc2626)}.countdown-progress .cp-fill[data-status=now]{background:linear-gradient(90deg,#fbbf24,#d97706)}.countdown-progress .cp-labels{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;font-size:11.5px;color:var(--muted)}.countdown-progress .cp-labels i{font-size:10px;margin-right:2px;color:var(--muted-2)}.countdown-progress .cp-labels .muted{color:var(--muted-2)}.countdown-progress .cp-labels .cp-right{font-weight:600;color:var(--muted);white-space:nowrap}.predict-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:12px;margin-bottom:16px}.predict-head .eyebrow{color:var(--primary);display:flex;align-items:center;gap:4px}.predict-head .eyebrow.sparkle i{animation:sparkle 2s ease-in-out infinite}.predict-head h2{margin:4px 0 0;font-size:20px;font-weight:700}.last-feed{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;border-radius:12px;margin-bottom:14px;border:1px solid #e8e9ff}.last-feed .last-feed-icon{width:38px;height:38px;border-radius:50%;background:var(--primary-soft);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.last-feed .last-feed-icon i{color:var(--primary);font-size:16px}.last-feed .last-feed-body{flex:1;min-width:0}.last-feed .last-feed-label{font-size:10px;font-weight:700;text-transform:uppercase;color:var(--muted-2);letter-spacing:.06em;margin-bottom:2px}.last-feed .last-feed-value{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.last-feed .last-feed-value strong{color:var(--primary);font-size:18px;font-weight:800}.last-feed .last-feed-value .sep{color:var(--muted-2)}.last-feed .last-feed-value .ago{color:var(--accent);font-weight:600;font-size:13px}.last-feed .last-feed-note{margin-top:4px;font-size:12px;color:var(--muted);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.predict-empty{padding:14px 16px;background:#fff;border-radius:12px;color:var(--muted);font-size:13px;display:flex;align-items:center;gap:8px}.predict-empty i{color:var(--primary)}.predict-body{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}@media(max-width:640px){.predict-body{grid-template-columns:1fr}}.predict-metric{background:#fff;border-radius:12px;padding:14px;text-align:center}.predict-metric .metric-label{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;display:flex;align-items:center;justify-content:center;gap:5px}.predict-metric .metric-label i{color:var(--primary);font-size:12px}.predict-metric .metric-value{font-size:28px;font-weight:800;line-height:1;color:var(--primary);font-variant-numeric:tabular-nums}.predict-metric .metric-value .ml-unit{font-size:14px;color:var(--muted);font-weight:500;margin-left:2px}.predict-metric .metric-sub{margin-top:6px;font-size:12px;color:var(--muted)}.reasoning{background:#fff;border-radius:12px;padding:12px 14px;margin-bottom:12px}.reasoning .reasoning-head{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted);letter-spacing:.05em;margin-bottom:6px}.reasoning .reasoning-head i{color:var(--primary);margin-right:4px}.reasoning ul{margin:0;padding-left:18px;list-style:disc}.reasoning li{font-size:13px;color:var(--text);line-height:1.55;margin:2px 0}.predict-actions{display:flex;justify-content:flex-end}.feed-list-card{margin-bottom:16px}.feed-list-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.feed-list-head h2{margin:4px 0 0;font-size:18px;font-weight:700}.feed-list-compact{display:flex;flex-direction:column;gap:6px}.feed-row{display:grid;grid-template-columns:68px 80px 1fr auto;gap:10px;align-items:center;padding:10px 12px;transition:all .2s ease;position:relative}.feed-row.low-volume .feed-row-volume strong{color:#f59e0b;font-weight:900}.feed-row.high-volume .feed-row-volume strong{color:#10b981;font-weight:900}.feed-row{background:#fafbfc;border-radius:10px;border:1px solid var(--border)}.feed-row .feed-row-time{display:flex;flex-direction:column;line-height:1.2;font-variant-numeric:tabular-nums;gap:3px}.feed-row .feed-row-time .time{font-weight:700;color:var(--text);font-size:14px}.feed-row .feed-row-time .date{font-size:11px;color:var(--muted-2)}.feed-row .feed-row-time .feed-row-gap{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:600;color:#6b7280;background:#f3f4f6;padding:1px 6px;border-radius:999px;width:fit-content;white-space:nowrap;font-variant-numeric:tabular-nums}.feed-row .feed-row-time .feed-row-gap i{font-size:8px;opacity:.7}.feed-row .feed-row-time .feed-row-gap.feed-gap-warn{background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-weight:700;border:1px solid rgba(234,88,12,.45);box-shadow:0 0 0 1px #fff3 inset,0 2px 8px #ea580c59}.feed-row .feed-row-time .feed-row-gap.feed-gap-warn i{opacity:.95;color:inherit}.feed-row .feed-row-volume{font-variant-numeric:tabular-nums}.feed-row .feed-row-volume strong{color:var(--primary);font-size:19px;font-weight:800;letter-spacing:-.01em}.feed-row .feed-row-volume .u{font-size:11px;color:var(--muted);margin-left:2px}.feed-row .feed-row-note{font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.feed-row .feed-row-note.muted{color:var(--muted-2);font-style:italic}.feed-row .feed-row-actions{display:inline-flex;align-items:center;gap:2px;margin-left:auto}.feed-row .feed-row-edit,.feed-row .feed-row-del{background:transparent;border:none;color:var(--muted-2);cursor:pointer;padding:6px 8px;border-radius:6px;font-size:13px}.feed-row .feed-row-edit:hover{color:var(--primary, #5b6cff);background:#5b6cff1a}.feed-row .feed-row-del:hover{color:var(--rose);background:var(--rose-soft)}@media(max-width:480px){.feed-row{grid-template-columns:58px 70px 1fr auto;gap:8px;padding:8px 10px}.feed-row .feed-row-time .time{font-size:13px}}.dialog-wide{max-width:720px;display:flex;flex-direction:column;padding:0;overflow:hidden}@media(max-width:640px){.dialog-wide{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 72px);border-radius:14px}}.dialog-wide .dialog-head{position:sticky;top:0;z-index:5;background:var(--surface);padding:16px 20px;margin:0;border-bottom:1px solid var(--border);-webkit-backdrop-filter:saturate(1.2) blur(6px);backdrop-filter:saturate(1.2) blur(6px)}@media(max-width:640px){.dialog-wide .dialog-head{padding:12px 14px}}.dialog-wide .dialog-close{width:40px;height:40px;font-size:16px;background:#f1f3f7;color:var(--text)}.dialog-wide .dialog-close:hover{background:var(--rose-soft);color:var(--rose)}.dialog-wide .history-body,.dialog-wide .tips-dialog-body{padding:18px 20px 24px;overflow-y:auto;flex:1;min-height:0}@media(max-width:640px){.dialog-wide .history-body,.dialog-wide .tips-dialog-body{padding:14px 14px 20px}}.history-body{display:flex;flex-direction:column;gap:18px}.history-paging-hint{margin:0;font-size:12px;line-height:1.45}.history-load-more{display:grid;justify-items:center;width:100%;box-sizing:border-box;padding:8px 0 12px}.history-load-more .btn{width:auto;max-width:min(320px,100%);min-width:0;margin-inline:auto;justify-content:center}.tips-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;background:#f1f3f7;border-radius:12px;margin-bottom:16px}.nav-arrow{width:40px;height:40px;border-radius:50%;border:none;background:#fff;color:var(--primary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:16px;transition:all .15s;flex-shrink:0}.nav-arrow:hover:not(:disabled){background:var(--primary);color:#fff;transform:scale(1.05)}.nav-arrow:active:not(:disabled){transform:scale(.95)}.nav-arrow:disabled{opacity:.35;cursor:not-allowed}.tips-now-btn{flex:1;padding:9px 16px;border:none;background:transparent;border-radius:999px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:all .15s}.tips-now-btn i{font-size:12px}.tips-now-btn:hover{color:var(--primary);background:#fff}.tips-now-btn.active{background:var(--primary);color:#fff;pointer-events:none}.tips-dialog-body .period-summary{font-size:14px;color:var(--muted);line-height:1.6;margin:0 0 14px}.tips-dialog-body .schedule-grid{grid-template-columns:repeat(2,1fr);margin-bottom:16px}@media(max-width:560px){.tips-dialog-body .schedule-grid{grid-template-columns:1fr}}.dialog-tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.history-group .history-group-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--primary-soft);border-radius:10px;margin-bottom:8px}.history-group .history-group-head .h-date{font-size:14px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.history-group .history-group-head .h-day{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.history-group .history-group-head .h-total{font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.history-group .history-group-head .h-total strong{color:var(--primary);font-size:20px;font-weight:800}.history-group .history-group-head .h-total .h-count{color:var(--muted);font-size:12px;font-weight:500;margin-left:4px}.history-group .history-group-head .h-total .h-avg{color:var(--primary);font-size:12px;font-weight:600;margin-left:4px;font-variant-numeric:tabular-nums}.history-group .history-group-rows{display:flex;flex-direction:column;gap:4px}.tips-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:4px 4px 0}.tips-section-head .eyebrow i{margin-right:4px}.tips-section-head h2{margin:4px 0 0;font-size:20px;font-weight:700;color:var(--text)}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.filter-chip{padding:7px 14px;border:1.5px solid var(--border);background:#fff;border-radius:999px;font-size:13px;font-weight:500;cursor:pointer;color:var(--muted);display:inline-flex;align-items:center;gap:5px;transition:all .15s;font-family:inherit}.filter-chip i{font-size:12px}.filter-chip:hover{border-color:var(--cat-color, var(--primary));color:var(--cat-color, var(--primary))}.filter-chip.active{background:var(--cat-color, var(--primary));border-color:var(--cat-color, var(--primary));color:#fff}.tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:20px}.tip-card{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--cat-color, var(--primary));border-radius:12px;padding:16px;transition:transform .15s}.tip-card:hover{transform:translateY(-2px)}.tip-card .tip-head{margin-bottom:8px}.tip-card .tip-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;background:var(--cat-color, var(--primary));color:#fff;font-size:11px;font-weight:600;border-radius:999px;text-transform:uppercase;letter-spacing:.04em}.tip-card .tip-pill i{font-size:10px}.tip-card .tip-title{margin:6px 0 8px;font-size:15px;font-weight:700;line-height:1.35;color:var(--text)}.tip-card .tip-body{margin:0;font-size:13px;line-height:1.55;color:var(--muted)}.empty{grid-column:1/-1;padding:40px 20px;text-align:center;color:var(--muted-2)}.empty i{font-size:32px;margin-bottom:8px;display:block}.upcoming{margin-bottom:24px}.upcoming h3{margin:0 0 12px;font-size:16px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px}.upcoming h3 i{color:var(--primary)}.upcoming-grid{display:flex;gap:8px;flex-wrap:wrap}.upcoming-item{padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:10px;font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}.upcoming-item i{color:var(--primary);font-size:12px}.disclaimer{padding:16px;background:var(--amber-soft);border-radius:12px;color:#78350f;font-size:13px;line-height:1.5;margin-bottom:24px;display:flex;gap:8px;align-items:flex-start}.disclaimer i{color:var(--amber);margin-top:2px}.toast{position:fixed;bottom:100px;left:50%;transform:translate(-50%);z-index:90;padding:12px 18px;border-radius:12px;font-size:14px;font-weight:500;box-shadow:0 6px 24px #0f172a1f;display:flex;align-items:center;gap:8px;animation:toastIn .3s cubic-bezier(.4,0,.2,1)}.toast.success{background:var(--mint);color:#fff}.toast.error{background:var(--rose);color:#fff}@keyframes toastIn{0%{transform:translate(-50%,20px);opacity:0}to{transform:translate(-50%);opacity:1}}.fab{position:fixed;bottom:calc(80px + env(safe-area-inset-bottom,0px));right:20px;z-index:96;display:inline-flex;align-items:center;gap:10px;padding:14px 22px 14px 18px;background:var(--primary);color:#fff;border:none;border-radius:999px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:0 8px 24px #5b6cff73;transition:transform .15s,box-shadow .15s,background .15s}.fab i{font-size:18px;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#ffffff2e}.fab .fab-label{white-space:nowrap}.fab:hover{background:var(--primary-2);transform:translateY(-2px);box-shadow:0 12px 28px #5b6cff8c}.fab:active{transform:translateY(0)}@media(max-width:480px){.fab{padding:14px}.fab .fab-label{display:none}.fab i{font-size:22px;width:28px;height:28px}}.dialog-overlay{position:fixed;inset:0;background:#0f172a8c;z-index:110;display:flex;align-items:center;justify-content:center;padding:20px;animation:overlayIn .2s ease-out}.dialog-overlay.dialog-overlay--front{z-index:400}.dialog-overlay.dialog-overlay--event-reminder{z-index:410}@media(max-width:640px){.dialog-overlay{padding:calc(env(safe-area-inset-top,0px) + 16px) 12px calc(env(safe-area-inset-bottom,0px) + 16px);align-items:flex-start}}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}.dialog{background:var(--surface);border-radius:20px;width:100%;max-width:560px;max-height:min(100vh - 40px,100dvh - 40px);overflow-y:auto;padding:24px;animation:dialogIn .25s cubic-bezier(.4,0,.2,1);box-shadow:0 20px 60px #0f172a40}@media(max-width:640px){.dialog{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 32px);border-radius:16px}}@keyframes dialogIn{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}.dialog-head h2{margin:4px 0 0;font-size:20px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}.dialog-head h2 i{color:var(--primary)}.dialog-close{background:#f1f3f7;border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;color:var(--muted);font-size:14px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,color .15s}.dialog-close:hover{background:var(--rose-soft);color:var(--rose)}.log-form{display:flex;flex-direction:column;gap:14px}.log-volume-field{margin:0}.log-volume-field .log-volume-input-row{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 10px;min-width:0}.log-volume-field .log-volume-input-row>input[type=number]{flex:0 0 118px;width:118px;max-width:min(118px,100%);min-width:0}.log-volume-field .predict-hint--inline{flex:1 1 auto;min-width:0;margin:0;padding:6px 10px;gap:6px;font-size:12px;border-radius:8px}.log-volume-field .predict-hint--inline>i{font-size:13px;flex-shrink:0}.log-volume-field .predict-hint--inline .hint-text{flex:1 1 auto;min-width:0;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.log-volume-field .predict-hint--inline .btn.small{flex-shrink:0;padding:4px 8px;font-size:11px}@media(max-width:400px){.log-volume-field .log-volume-input-row>input[type=number]{flex:1 1 100px;width:100%;max-width:none}.log-volume-field .predict-hint--inline{flex:1 1 100%;white-space:normal}.log-volume-field .predict-hint--inline .hint-text{white-space:normal;overflow:visible;text-overflow:unset}}.edit-date-banner{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 14px;background:linear-gradient(135deg,#eef2ff,#f5f3ff);border:1px solid #dbe1ff;border-radius:12px;font-size:13px;color:var(--text)}.edit-date-banner>i.pi-calendar{color:var(--primary, #5b6cff);font-size:15px}.edit-date-banner .edb-label{color:var(--muted, #6b7280);font-weight:500}.edit-date-banner .edb-value{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.edit-date-banner .edb-lock{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex-shrink:0;border-radius:50%;background:#ffffffe0;border:1px solid #e2e8f0;color:var(--muted, #64748b)}.edit-date-banner .edb-lock i{font-size:14px;line-height:1}.log-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.log-grid .field.full{grid-column:1/-1}.log-grid.log-grid--date-time{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:560px){.log-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:380px){.log-grid{grid-template-columns:1fr}}.quick-volumes{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.quick-volumes .quick-label{font-size:12px;color:var(--muted);font-weight:600;margin-right:4px}.quick-chip{padding:7px 13px;background:#f1f3f7;border:none;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer;color:var(--muted);transition:all .15s;font-family:inherit}.quick-chip:hover{background:var(--primary-soft);color:var(--primary)}.quick-chip.now-chip{background:var(--primary-soft);color:var(--primary);display:inline-flex;align-items:center;gap:4px}.quick-chip.now-chip:hover{background:var(--primary);color:#fff}.quick-chip.formula-chip{display:inline-flex;align-items:center;gap:5px;background:#fff7ed;color:#c2410c;border:1px solid #fed7aa}.quick-chip.formula-chip i{font-size:11px;opacity:.9}.quick-chip.formula-chip:hover{background:#ffedd5;color:#9a3412;border-color:#fdba74}.quick-chip.formula-chip.active{background:#c2410c;color:#fff;border-color:#c2410c;box-shadow:0 2px 8px #c2410c40}.quick-chip.formula-chip.active:hover{background:#9a3412;border-color:#9a3412;color:#fff}.bottle-prep{background:#f0f9ff;border:1px solid #bae6fd;border-radius:12px;padding:8px 12px;margin-bottom:16px;display:flex;flex-direction:column;gap:8px;transition:background .2s,border-color .2s}.bottle-prep:has(.bp-warning){background:#fffbeb;border-color:#fde68a}.bottle-prep:has(.bp-warning) .bp-info>i{color:#f59e0b}.bottle-prep:has(.bp-warning) .bp-info strong{color:#d97706}.bottle-prep:has(.bp-warning) .bp-prep-user{color:#92400e;background:#fbbf246b}.bottle-prep:has(.bp-warning) .bp-prep-time{color:#c2410c;background:linear-gradient(180deg,#fff7ed,#ffedd5);border-color:#fb923c73}.bottle-prep:has(.bp-form){align-items:stretch;padding:10px 12px 12px}.bottle-prep .bp-warning{display:flex;align-items:center;justify-content:space-between;gap:10px;animation:slideDown .2s ease;flex-wrap:wrap}.bottle-prep .bp-warning__content{display:flex;align-items:center;gap:8px;font-size:13px;flex:1;min-width:0}.bottle-prep .bp-warning__content i{font-size:16px;flex-shrink:0}.bottle-prep .bp-warning__content strong{font-weight:700}.bottle-prep .bp-warning--expired{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:8px 10px;color:#991b1b}.bottle-prep .bp-warning--expired i{color:#dc2626}.bottle-prep .bp-warning--soon{background:#fefce8;border:1px solid #fde68a;border-radius:8px;padding:8px 10px;color:#92400e}.bottle-prep .bp-warning--soon i{color:#f59e0b}.bottle-prep .bp-warning__btn{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;padding:7px 12px;font-size:12px;font-weight:700;font-family:inherit;color:#fff;background:linear-gradient(180deg,#f59e0b,#d97706);border:none;border-radius:8px;cursor:pointer;box-shadow:0 2px 4px #f59e0b40;transition:all .15s ease}.bottle-prep .bp-warning__btn i{font-size:12px}.bottle-prep .bp-warning__btn:hover{background:linear-gradient(180deg,#fbbf24,#f59e0b);transform:translateY(-1px);box-shadow:0 4px 8px #f59e0b59}.bottle-prep .bp-warning__btn:active{transform:translateY(0)}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.bottle-prep .bp-info-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.bottle-prep:not(:has(.bp-warning)):not(:has(.bp-form)){flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}.bottle-prep .bp-info{display:flex;align-items:flex-start;gap:8px;font-size:14px;color:var(--text);flex:1;min-width:0}.bottle-prep .bp-info>i{color:#0ea5e9;font-size:16px;margin-top:2px;flex-shrink:0}.bottle-prep .bp-info .bp-text{line-height:1.45;min-width:0}.bottle-prep .bp-info .bp-useby{display:inline-block;margin-top:2px;font-size:13px}.bottle-prep .bp-info strong{color:#0284c7;font-weight:800;font-variant-numeric:tabular-nums}.bottle-prep .bp-info .muted{color:var(--muted);font-size:13px}.bottle-prep .bp-actions{display:flex;gap:4px}.bottle-prep .bp-add{flex:1;background:transparent;border:none;padding:6px 4px;font-size:13px;font-weight:600;color:#0284c7;cursor:pointer;display:flex;align-items:center;gap:8px;font-family:inherit;text-align:left}.bottle-prep .bp-add>i{font-size:15px}.bottle-prep .bp-add:hover{color:#0369a1}.bottle-prep .bp-form{display:flex;flex-direction:column;gap:8px;width:100%}.bottle-prep .bp-form-head{display:flex;align-items:center;gap:6px}.bottle-prep .bp-form-head>i{color:#0ea5e9;font-size:15px}.bottle-prep .bp-form-head .bp-label{font-size:13px;color:var(--muted);font-weight:600;white-space:nowrap}.bottle-prep .bp-input-wrap{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #7dd3fc;border-radius:10px;padding:3px;transition:border-color .15s,box-shadow .15s}.bottle-prep .bp-input-wrap:focus-within{border-color:#0ea5e9;box-shadow:0 0 0 3px #0ea5e926}.bottle-prep .bp-input-wrap .bp-step{width:30px;height:30px;flex-shrink:0;border-radius:8px;border:none;background:#e0f2fe;color:#0369a1;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-family:inherit;transition:all .12s}.bottle-prep .bp-input-wrap .bp-step:hover{background:#bae6fd;color:#0284c7}.bottle-prep .bp-input-wrap .bp-step:active{transform:scale(.94)}.bottle-prep .bp-input-wrap .bp-step:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.bottle-prep .bp-input-wrap .bp-input{flex:1;min-width:60px;padding:4px 6px;font-size:18px;font-weight:800;border:none;background:transparent;font-variant-numeric:tabular-nums;font-family:inherit;color:#d97706;text-align:center;letter-spacing:-.01em}.bottle-prep .bp-input-wrap .bp-input:focus{outline:none}.bottle-prep .bp-input-wrap .bp-input:disabled{opacity:.55;cursor:not-allowed}.bottle-prep .bp-input-wrap .bp-unit{font-size:12px;color:var(--muted);font-weight:600;padding-right:4px}.bottle-prep .bp-quick{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.bottle-prep .bp-quick .bp-quick-label{font-size:11px;color:var(--muted);font-weight:600;margin-right:2px}.bottle-prep .bp-quick .bp-quick-chip{padding:4px 9px;background:#f0f9ff;border:1px solid #7dd3fc;border-radius:999px;font-size:11.5px;font-weight:700;color:#0369a1;cursor:pointer;font-family:inherit;font-variant-numeric:tabular-nums;transition:all .12s}.bottle-prep .bp-quick .bp-quick-chip:hover{background:#e0f2fe;border-color:#38bdf8;color:#0284c7}.bottle-prep .bp-quick .bp-quick-chip:active{transform:scale(.95)}.bottle-prep .bp-quick .bp-quick-chip:disabled{opacity:.45;cursor:not-allowed}.bottle-prep .bp-form-actions{display:flex;gap:6px;justify-content:flex-end}.bottle-prep .bp-btn{width:32px;height:32px;border-radius:8px;border:none;background:#fff;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:12px;transition:all .15s;flex-shrink:0}.bottle-prep .bp-btn:hover:not(:disabled){background:#e0f2fe;color:#0284c7}.bottle-prep .bp-btn:disabled{opacity:.45;cursor:not-allowed}.bottle-prep .bp-btn.primary{background:#0ea5e9;color:#fff}.bottle-prep .bp-btn.primary:hover:not(:disabled){background:#0284c7}.bottle-prep .bp-btn.danger:hover{background:var(--rose-soft);color:var(--rose)}.calc-block{border:1px solid #fde7c2;background:#fffaf0;border-radius:12px;overflow:hidden}.calc-block .calc-head{padding:10px 14px 0}.calc-block .prep-info{display:flex;align-items:flex-start;gap:6px;font-size:13px;color:var(--text)}.calc-block .prep-info>i{color:#f59e0b;font-size:14px;margin-top:2px;flex-shrink:0}.calc-block .prep-info .prep-info-text{line-height:1.45;min-width:0}.calc-block .prep-info strong{color:#d97706;font-weight:800;font-variant-numeric:tabular-nums}.calc-block .prep-info .muted{color:var(--muted-2);font-size:12px;display:inline-block;margin-top:2px}.calc-block .calc-body{padding:8px 14px 14px;display:flex;flex-direction:column;gap:10px}.calc-block .field.mini.remaining-input{position:relative;margin:0;display:flex;flex-direction:column}.calc-block .field.mini.remaining-input .label{font-size:11px;font-weight:600;color:var(--muted);margin-bottom:4px}.calc-block .field.mini.remaining-input input{width:100%;padding:10px 36px 10px 12px;font-size:16px;font-weight:700;border:1px solid #fadf9e;border-radius:8px;background:#fff;font-variant-numeric:tabular-nums;font-family:inherit;color:#d97706}.calc-block .field.mini.remaining-input input:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b26}.calc-block .field.mini.remaining-input .suffix{position:absolute;right:12px;top:50%;transform:translateY(4px);font-size:12px;color:var(--muted-2);pointer-events:none}.calc-block .calc-result-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.calc-block .calc-result{display:flex;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums}.calc-block .calc-result .calc-label{font-size:13px;color:var(--muted);font-weight:600}.calc-block .calc-result strong{font-size:22px;font-weight:800;color:var(--primary)}.calc-block .calc-result .u{font-size:12px;color:var(--primary);margin-left:2px}.calc-block .calc-result .muted{color:var(--muted-2);font-size:18px}.calc-block .calc-apply{flex-shrink:0}.calc-block .calc-apply:disabled{background:#e5e7eb;color:var(--muted-2);cursor:not-allowed;box-shadow:none}.predict-hint{display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(135deg,var(--primary-soft) 0%,var(--accent-soft) 100%);border-radius:10px;font-size:13px}.predict-hint>i{color:var(--primary);font-size:16px}.predict-hint .hint-text{flex:1;color:var(--text)}.predict-hint .hint-text strong{color:var(--primary);font-weight:700}.predict-hint.predict-hint--inline .hint-text strong{font-weight:800;font-variant-numeric:tabular-nums}.sync-error{padding:10px 14px;background:var(--rose-soft);color:#991b1b;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:6px}.sync-success{padding:10px 14px;background:var(--mint-soft);color:#166534;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:6px;animation:fadeIn .2s ease}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}.feeding-settings-dialog .feeding-settings-hint{margin:0 0 14px;font-size:13px;line-height:1.45}.feeding-settings-dialog .feeding-settings-hint code{font-size:11px;padding:1px 5px;border-radius:4px;background:#f1f5f9}.feeding-settings-dialog .feeding-settings-grid{grid-template-columns:1fr;gap:16px}.feeding-settings-dialog .field-hint{display:block;margin-top:8px;font-size:12px;line-height:1.4;padding:8px 12px;background:#f8fafc;border-radius:8px;border-left:3px solid #e2e8f0}.feeding-settings-dialog .label{position:relative}.feeding-settings-dialog .label code{font-size:11px;font-weight:600;color:var(--primary);background:var(--primary-soft);padding:2px 6px;border-radius:4px}.feeding-settings-dialog .label .notification-badge{display:inline-flex;align-items:center;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff;background:linear-gradient(135deg,#10b981,#059669);padding:2px 6px;border-radius:10px;margin-left:6px;box-shadow:0 1px 2px #10b98133;animation:gentle-pulse 2s ease-in-out infinite}.feeding-settings-dialog .notification-setting-field{position:relative}.feeding-settings-dialog .notification-setting-field input{border:1.5px solid #10b981;background:linear-gradient(to right,#fff,#f0fdf4)}.feeding-settings-dialog .notification-setting-field input:focus{border-color:#059669;box-shadow:0 0 0 3px #10b9811a;background:#fff}.feeding-settings-dialog .notification-setting-field input::placeholder{color:#6b7280;opacity:.7}.feeding-settings-dialog .notification-setting-field .field-hint{border-left-color:#10b981;background:linear-gradient(to right,#f0fdf4,#f8fafc)}@keyframes gentle-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.02)}}.log-time--with-badge,.feed-row-time .time--with-badge{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}.log-merge-badge,.feed-merge-badge{font:inherit;font-size:10px;font-weight:700;padding:2px 7px;border-radius:999px;border:1px solid rgba(99,102,241,.35);background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#312e81;cursor:pointer;line-height:1.2;white-space:nowrap}.log-merge-badge:hover,.feed-merge-badge:hover{filter:brightness(1.03)}.log-row--clickable,.feed-row--clickable{cursor:pointer}.log-row--clickable:hover,.feed-row--clickable:hover{background:#6366f10f}.log-row--clickable:focus-visible,.feed-row--clickable:focus-visible{outline:2px solid rgba(99,102,241,.45);outline-offset:2px}.dialog-overlay.dialog-overlay--front.feed-group-detail-overlay{z-index:125}.dialog-overlay.dialog-overlay--front.feed-detail-overlay{z-index:140;animation:overlayIn .12s ease-out}.dialog-overlay.dialog-overlay--front.feed-detail-overlay .feed-detail-dialog{animation:feedDetailIn .14s ease-out}@keyframes feedDetailIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.feed-detail-dialog{--fd-accent: 99, 102, 241;--fd-soft: #eef2ff;--fd-strong: #4338ca;max-width:min(400px,96vw);padding:0;overflow:hidden;display:flex;flex-direction:column}.feed-detail-dialog[data-status=low]{--fd-accent: 245, 158, 11;--fd-soft: #fffbeb;--fd-strong: #b45309}.feed-detail-dialog[data-status=high]{--fd-accent: 244, 63, 94;--fd-soft: #fff1f2;--fd-strong: #e11d48}.feed-detail-dialog[data-status=ok]{--fd-accent: 16, 185, 129;--fd-soft: #ecfdf5;--fd-strong: #059669}.feed-detail-top{position:relative;padding:20px 20px 16px;text-align:center;background:radial-gradient(120% 80% at 50% -20%,rgba(var(--fd-accent),.22),transparent 55%),linear-gradient(180deg,var(--fd-soft) 0%,#ffffff 72%);border-bottom:1px solid rgba(var(--fd-accent),.12)}.feed-detail-close{position:absolute;top:12px;right:12px;width:36px;height:36px;border:none;border-radius:50%;background:#ffffffd9;color:#64748b;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px #0f172a14;transition:background .15s ease,color .15s ease}.feed-detail-close:hover{background:#fff;color:#0f172a}.feed-detail-eyebrow{margin:0 0 6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b}.feed-detail-metric{display:flex;align-items:flex-end;justify-content:center;gap:4px;line-height:1;margin-bottom:10px}.feed-detail-metric__value{font-size:clamp(48px,14vw,56px);font-weight:800;letter-spacing:-.04em;color:var(--fd-strong);font-variant-numeric:tabular-nums}.feed-detail-metric__unit{font-size:18px;font-weight:700;color:rgba(var(--fd-accent),.85);padding-bottom:8px}.feed-detail-status{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700;background:#fff;border:1px solid rgba(var(--fd-accent),.28);color:var(--fd-strong);box-shadow:0 2px 6px rgba(var(--fd-accent),.1)}.feed-detail-status .pi{font-size:13px}.feed-detail-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px}.feed-detail-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:12px;background:#ffffffeb;border:1px solid #e2e8f0;font-size:12px;font-weight:600;color:#334155;line-height:1.3;box-shadow:0 1px 4px #0f172a0a}.feed-detail-chip .pi{font-size:13px;color:#6366f1;flex-shrink:0}.feed-detail-chip em{font-style:normal;font-weight:500;color:#94a3b8;margin-left:4px}.feed-detail-chip--time .pi{color:#dc2626}.feed-detail-chip--time span{font-variant-numeric:tabular-nums;font-weight:700;color:#dc2626}.feed-detail-chip--muted{background:#f8fafc;border-color:#e2e8f0;color:#64748b;font-weight:500}.feed-detail-chip--muted .pi{color:#94a3b8}.feed-detail-body{padding:16px 18px 8px;overflow-y:auto;flex:1;min-height:0}.feed-detail-section{margin-bottom:14px}.feed-detail-section:last-child{margin-bottom:0}.feed-detail-section__title{margin:0 0 10px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;display:flex;align-items:center;gap:7px}.feed-detail-section__title .pi{font-size:13px;color:#6366f1}.feed-detail-cards{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.feed-detail-card{display:flex;align-items:flex-start;gap:12px;padding:12px 13px;border-radius:14px;background:linear-gradient(180deg,#fafbff,#fff);border:1px solid #e2e8f0;box-shadow:0 2px 8px #0f172a0a}.feed-detail-card--warn,.feed-detail-card--gap.feed-detail-card--warn{border-color:#f59e0b66;background:linear-gradient(180deg,#fffbeb,#fff)}.feed-detail-card--warn .feed-detail-card__icon,.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__icon{background:#fef3c7;color:#b45309}.feed-detail-card--warn .feed-detail-card__text,.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__text{color:#92400e}.feed-detail-card--position{border-color:#8b5cf659;background:linear-gradient(180deg,#f5f3ff,#fff)}.feed-detail-card--average{border-color:#0ea5e959;background:linear-gradient(180deg,#f0f9ff,#fff)}.feed-detail-card--next{border-color:#10b98159;background:linear-gradient(180deg,#ecfdf5,#fff)}.feed-detail-card--gap:not(.feed-detail-card--warn){border-color:#64748b59;background:linear-gradient(180deg,#f8fafc,#fff)}.feed-detail-card__icon{flex-shrink:0;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#eef2ff;color:#4f46e5;font-size:15px}.feed-detail-card__icon[data-kind=position]{background:#ede9fe;color:#7c3aed}.feed-detail-card__icon[data-kind=average]{background:#e0f2fe;color:#0284c7}.feed-detail-card__icon[data-kind=next]{background:#d1fae5;color:#059669}.feed-detail-card__icon[data-kind=gap]{background:#e2e8f0;color:#475569}.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__icon{background:#fef3c7;color:#b45309}.feed-detail-card__body{min-width:0;flex:1}.feed-detail-card__label{display:block;font-size:11px;font-weight:800;color:#64748b;margin-bottom:3px;letter-spacing:.02em}.feed-detail-card__text{margin:0;font-size:13px;line-height:1.5;color:#0f172a}.fdc-position__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin-bottom:8px}.fdc-position__idx{font-size:18px;font-weight:800;color:#6d28d9;letter-spacing:-.02em}.fdc-position__of{font-size:14px;font-weight:700;color:#a78bfa}.fdc-position__tag{font-size:11px;font-weight:600;color:#64748b;padding:2px 8px;border-radius:999px;background:#8b5cf61a}.fdc-progress{height:8px;border-radius:999px;background:#ede9fe;overflow:hidden;margin-bottom:10px}.fdc-progress__fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#8b5cf6,#6366f1);transition:width .2s ease}.fdc-position__stats{display:flex;flex-wrap:wrap;gap:8px}.fdc-stat{display:inline-flex;align-items:baseline;gap:4px;padding:6px 10px;border-radius:10px;font-size:12px}.fdc-stat strong{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}.fdc-stat small{font-size:11px;font-weight:600;opacity:.85}.fdc-stat--violet{background:#f5f3ff;color:#5b21b6}.fdc-stat--violet strong{color:#6d28d9}.fdc-stat--indigo{background:#eef2ff;color:#4338ca}.fdc-stat--indigo strong{color:#4f46e5}.fdc-avg,.fdc-next{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}.fdc-pill{display:inline-flex;padding:4px 10px;border-radius:999px;font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}.fdc-pill--up{background:#dcfce7;color:#15803d}.fdc-pill--down{background:#fee2e2;color:#b91c1c}.fdc-pill--neutral{background:#f1f5f9;color:#475569}.fdc-avg__meta{font-size:12px;color:#64748b;line-height:1.4}.fdc-avg__meta strong{color:#0f172a;font-weight:700}.fdc-next__time{font-size:16px;font-weight:800;color:#dc2626;font-variant-numeric:tabular-nums}.fdc-next__vol{font-size:14px;font-weight:800;color:#059669;padding:4px 10px;border-radius:8px;background:#d1fae5}.fdc-next__gap{font-size:12px;font-weight:600;color:#64748b;display:inline-flex;align-items:center;gap:4px}.fdc-gap{display:flex;flex-direction:column;gap:10px}.fdc-gap__prev{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;padding:10px 12px;border-radius:10px;background:#ffffffe6;border:1px solid #e2e8f0}.fdc-gap__prev-label{font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;width:100%}.fdc-gap__prev-time{font-size:17px;font-weight:800;color:#0f172a;font-variant-numeric:tabular-nums}.fdc-gap__prev-vol{font-size:14px;font-weight:800;color:#475569;padding:3px 8px;border-radius:8px;background:#f1f5f9}.fdc-gap__prev-date{font-size:11px;font-weight:600;color:#94a3b8}.fdc-gap__row{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;min-width:0}.fdc-gap__interval{display:inline-flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;color:#475569;background:#e2e8f0;white-space:nowrap}.fdc-gap__interval .pi{font-size:13px;flex-shrink:0}.fdc-gap__interval span{overflow:hidden;text-overflow:ellipsis}.fdc-gap__interval--warn{color:#b45309;background:#fde68a;border:1px solid rgba(245,158,11,.35)}.fdc-gap__vol-diff{flex:0 0 auto;white-space:nowrap;font-size:12px;padding:5px 10px}.feed-detail-quote{margin:0;padding:12px 14px 12px 16px;border-radius:0;border-left:3px solid #c7d2fe;background:#f8fafc;font-size:14px;line-height:1.55;color:#334155;font-style:normal}.feed-detail-footer{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid #e2e8f0;background:#fafbff}.feed-detail-cta{display:flex;gap:8px;justify-content:stretch}.feed-detail-cta .btn{flex:1;justify-content:center}.feed-detail-cta .btn.primary{flex:1.2}.feed-group-detail-dialog .feed-group-detail-summary{margin:0 0 8px;padding:0 2px;font-size:13px;line-height:1.45}.feed-group-detail-dialog .feed-group-detail-hint{margin:0 0 12px;font-size:12px;line-height:1.4;display:flex;align-items:center;gap:6px}.feed-group-detail-dialog .feed-group-detail-history{margin-bottom:4px}.feed-group-detail-dialog .feed-group-detail-rows{max-height:min(58vh,420px);overflow-y:auto;padding-right:2px}.mom-food-card{--mf-tone: 244, 114, 182;--mf-soft: #fdf2f8;--mf-ring: #fbcfe8;--mf-strong: #db2777;position:relative;overflow:hidden;background:radial-gradient(900px 260px at 0% 0%,rgba(var(--mf-tone),.14),transparent 60%),#fff;border-color:rgba(var(--mf-tone),.22);padding:18px;margin-top:16px}.mom-food-card[data-accent=rose]{--mf-tone: 244, 63, 94;--mf-soft: #fff1f2;--mf-ring: #fecdd3;--mf-strong: #e11d48}.mom-food-card[data-accent=peach]{--mf-tone: 251, 146, 60;--mf-soft: #fff7ed;--mf-ring: #fed7aa;--mf-strong: #ea580c}.mom-food-card[data-accent=mint]{--mf-tone: 16, 185, 129;--mf-soft: #ecfdf5;--mf-ring: #a7f3d0;--mf-strong: #059669}.mom-food-card[data-accent=lavender]{--mf-tone: 139, 92, 246;--mf-soft: #f5f3ff;--mf-ring: #ddd6fe;--mf-strong: #7c3aed}.mom-food-card[data-accent=amber]{--mf-tone: 245, 158, 11;--mf-soft: #fffbeb;--mf-ring: #fde68a;--mf-strong: #d97706}.mf-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.mf-head__lead{min-width:0;flex:1}.mf-head .eyebrow{display:inline-flex;align-items:center;gap:6px;color:var(--mf-strong);font-weight:700}.mf-head .eyebrow i{font-size:13px}.mf-head h2{margin:4px 0 0;font-size:18px;font-weight:800;color:var(--text);line-height:1.25}.mf-headline{margin:4px 0 0;font-size:13px;color:var(--mf-strong);font-weight:600}.mf-nav{display:inline-flex;align-items:center;gap:6px;background:var(--mf-soft);border-radius:999px;padding:4px;border:1px solid rgba(var(--mf-tone),.25);flex-shrink:0}.mf-arrow{width:30px;height:30px;border-radius:50%;border:none;background:#fff;color:var(--mf-strong);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease,background .15s ease}.mf-arrow i{font-size:12px}.mf-arrow:hover:not(:disabled){transform:scale(1.08);background:var(--mf-strong);color:#fff}.mf-arrow:disabled{opacity:.35;cursor:not-allowed}.mf-step{font-variant-numeric:tabular-nums;font-size:12px;color:var(--muted);padding:0 4px}.mf-step strong{color:var(--mf-strong);font-weight:800;font-size:13px}.mf-reset{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--mf-strong);background:transparent;border:1px dashed rgba(var(--mf-tone),.5);border-radius:999px;padding:4px 12px;cursor:pointer;margin-bottom:10px;transition:background .15s ease}.mf-reset:hover{background:var(--mf-soft)}.mf-reset i{font-size:11px}.mf-desc{margin:0 0 14px;font-size:13px;color:var(--muted);line-height:1.55}.mf-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}@media(max-width:640px){.mf-columns{grid-template-columns:1fr}}.mf-col{padding:12px 14px;border-radius:14px;background:#fff;border:1px solid #eef0f3}.mf-col--good{background:linear-gradient(180deg,#f0fdf4,#fff 80%);border-color:#bbf7d0}.mf-col--bad{background:linear-gradient(180deg,#fef2f2,#fff 80%);border-color:#fecaca}.mf-col-title{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:14px;font-weight:800;color:var(--text);letter-spacing:.01em}.mf-dot{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;flex-shrink:0;font-size:11px}.mf-dot i{font-size:10px}.mf-dot.good{background:#10b981;box-shadow:0 2px 6px #10b9814d}.mf-dot.bad{background:#ef4444;box-shadow:0 2px 6px #ef44444d}.mf-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.mf-item{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:10px;background:#ffffffb3;transition:background .15s ease,transform .15s ease}.mf-item:hover{background:#fff;transform:translate(2px)}.mf-item--bad .mf-name{color:#7f1d1d}.mf-item--good .mf-name{color:#064e3b}.mf-emoji{width:28px;height:28px;border-radius:8px;background:#fff;display:inline-grid;place-items:center;font-size:16px;flex-shrink:0;box-shadow:0 1px 2px #0f172a0f}.mf-emoji--x{background:#fef2f2;color:#ef4444}.mf-emoji--x i{font-size:12px}.mf-item-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.mf-name{font-size:13px;font-weight:700;color:var(--text);line-height:1.3}.mf-note{font-size:11.5px;color:var(--muted);line-height:1.35}.mf-tip{display:flex;align-items:flex-start;gap:8px;padding:10px 14px;border-radius:12px;background:var(--mf-soft);border:1px solid rgba(var(--mf-tone),.22);font-size:12.5px;color:var(--text);line-height:1.5}.mf-tip i{color:var(--mf-strong);font-size:15px;margin-top:1px;flex-shrink:0}.mom-tab .card{padding:12px 14px;margin-bottom:10px;border-radius:14px}.mom-tab .mom-wellness-section,.mom-tab .mom-tips-week{margin-bottom:10px}.mom-tab .mom-food-card{padding:12px 14px;margin-top:10px}.mom-tab .mf-head{margin-bottom:8px}.mom-tab .mf-head h2{font-size:16px}.mom-tab .mf-desc{margin-bottom:10px;font-size:12px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.mom-tab .mf-columns{gap:8px;margin-bottom:8px}.mom-tab .mf-col{padding:8px 10px}.mom-tab .mf-list{gap:6px}.mom-tab .mf-item{padding:6px 8px}.mom-tab .mf-tip{padding:8px 10px;font-size:12px}.mom-hero{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;margin-bottom:14px;background:linear-gradient(135deg,#fdf2f8,#faf5ff,#eef2ff);border:1px solid #f9a8d4;border-radius:16px}.mom-hero .mom-hero__icon{font-size:36px;line-height:1;flex-shrink:0}.mom-hero h2{margin:0 0 6px;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.02em}.mom-hero .mom-hero__sub{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}.mom-hero .mom-hero__sub strong{color:var(--text)}.mom-hero .mom-hero__sub .muted-inline{display:block;margin-top:4px;font-size:12.5px;opacity:.92}.mom-hero--compact{align-items:center;padding:10px 12px;margin-bottom:10px;border-radius:14px;gap:10px}.mom-hero--compact .mom-hero__icon{font-size:26px}.mom-hero--compact h2{margin:0;font-size:16px;letter-spacing:-.01em}.mom-hero--compact .mom-hero__title-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px}.mom-hero--compact .mom-hero__baby{font-size:12px;font-weight:700;color:#be185d;padding:2px 8px;border-radius:999px;background:#ffffffbf;border:1px solid rgba(244,114,182,.35)}.mom-hero--compact .mom-hero__sub{margin:4px 0 0;font-size:11.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mom-hero--compact .mom-hero__sub .muted-inline{display:inline;margin-top:0;font-size:11.5px}.section-head--tight{margin-bottom:8px}.section-head--tight h3{margin:0}.mom-disclaimer--compact{font-size:11px;line-height:1.4;padding:8px 10px;margin-top:4px;margin-bottom:6px}.section-head{margin-bottom:14px}.section-head h3{margin:0 0 6px;font-size:16px;font-weight:800;display:flex;align-items:center;gap:8px;color:var(--text)}.section-head h3 i{color:#db2777;font-size:15px}.section-head .section-sub{margin:0;font-size:12.5px;color:var(--muted);line-height:1.45}.mom-wellness-section{margin-bottom:16px}.mom-tab .mom-wellness-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}.mom-wellness-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.mom-w-card{padding:14px 14px 12px;border-radius:14px;border:1px solid var(--border);background:#fafafa;transition:border-color .15s,box-shadow .15s}.mom-w-card:hover{border-color:#f472b6;box-shadow:0 6px 18px -12px #db277759}.mom-w-card .mom-w-card__icon{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#fce7f3,#ede9fe);display:flex;align-items:center;justify-content:center;margin-bottom:10px}.mom-w-card .mom-w-card__icon i{font-size:16px;color:#be185d}.mom-w-card h4{margin:0 0 8px;font-size:13.5px;font-weight:800;color:var(--text);line-height:1.3}.mom-w-card p{margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}.mom-tips-week{margin-bottom:16px}.mom-tab .mom-tips-list{gap:6px}.mom-tab .mom-tips-list li{padding:8px 10px;border-radius:10px}.mom-tab .mom-tips-list li strong{margin-bottom:2px;font-size:12px}.mom-tab .mom-tips-list li span{font-size:11.5px;line-height:1.4}.mom-tips-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.mom-tips-list li{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:#fefce8;border:1px solid #fde047}.mom-tips-list li>i{color:#ca8a04;margin-top:2px;flex-shrink:0}.mom-tips-list li strong{display:block;font-size:13px;font-weight:800;color:var(--text);margin-bottom:4px}.mom-tips-list li span{font-size:12.5px;line-height:1.5;color:var(--muted)}.mom-disclaimer{margin-top:8px;margin-bottom:8px}.mom-empty-profile{max-width:520px;margin:24px auto 40px;text-align:center}.mom-empty-profile__inner{padding:28px 22px}.mom-empty-profile__inner .mom-empty-emoji{font-size:48px;display:block;margin-bottom:12px}.mom-empty-profile__inner h2{margin:0 0 10px;font-size:17px;font-weight:800;color:var(--text)}.mom-empty-profile__inner p{margin:0 0 18px;font-size:14px;line-height:1.55;color:var(--muted)}.event-reminder-dialog{max-width:min(520px,100vw - 28px);padding-bottom:8px}.event-reminder-dialog__head{align-items:flex-start;margin-bottom:4px}.event-reminder-dialog__title{margin:0;padding-right:40px;font-size:20px;font-weight:800;line-height:1.3;color:var(--text, #0f172a);display:flex;align-items:center;gap:10px;letter-spacing:-.02em}.event-reminder-dialog__title .pi-bell{color:#f59e0b;font-size:18px;flex-shrink:0}.event-reminder-list{list-style:none;margin:12px 0 0;padding:0;max-height:min(52vh,400px);overflow:auto;display:flex;flex-direction:column;gap:10px}.event-reminder-card{padding:14px 16px;background:linear-gradient(180deg,#fafbff,#fff);border:1px solid #e2e8f0;border-radius:14px;box-shadow:0 2px 8px #0f172a0d}.event-reminder-card__title{margin:0;font-size:16px;font-weight:800;color:var(--text, #0f172a);line-height:1.35}.event-reminder-card__datetime{margin:5px 0 0;font-size:12.5px;font-weight:500;color:#64748b;line-height:1.4}.event-reminder-card__date{color:#475569;font-weight:600}.event-reminder-card__sep{color:#94a3b8}.event-reminder-card__hour{color:#dc2626;font-weight:700;font-variant-numeric:tabular-nums}.event-reminder-card__place{margin:6px 0 0;display:flex;align-items:flex-start;gap:6px;font-size:13px;color:#475569;line-height:1.4}.event-reminder-card__place .pi-map-marker{margin-top:2px;flex-shrink:0;font-size:13px;color:var(--primary, #5b6cff)}.event-reminder-card__content-wrap{margin-top:10px;padding-top:10px;border-top:1px solid #eef1f6}.event-reminder-card__content-label{display:block;margin-bottom:4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8}.event-reminder-card__content{margin:0;font-size:13.5px;color:#334155;line-height:1.5;white-space:pre-wrap}.event-reminder-actions{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border, #e5e7eb)}.event-reminder-actions__link{flex:0 1 auto;min-width:0;padding:6px 4px;border:none;background:transparent;color:#64748b;font-size:13px;font-weight:600;font-family:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.event-reminder-actions__link:hover:not(:disabled){color:#334155}.event-reminder-actions__link:disabled{opacity:.5;cursor:not-allowed}.event-reminder-actions__primary{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;font-size:15px;font-weight:700;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DocumentsComponent, selector: "app-documents" }, { kind: "component", type: MedicalHistoryComponent, selector: "app-medical-history", inputs: ["user"], outputs: ["openExplorerFile"] }, { kind: "component", type: WeightComponent, selector: "app-weight", inputs: ["user", "birthDate", "gender", "babyName"] }, { kind: "component", type: ActivityLogComponent, selector: "app-activity-log", outputs: ["activityChanged"] }, { kind: "component", type: FeedingScheduleComponent, selector: "app-feeding-schedule", inputs: ["user"] }, { kind: "component", type: FeedingMomComponent, selector: "app-feeding-mom", inputs: ["profile", "editing"], outputs: ["goToFeeding"] }, { kind: "component", type: FeedingChartsComponent, selector: "app-feeding-charts", inputs: ["logs", "now", "nutritionTarget"] }, { kind: "component", type: FeedingNutritionComponent, selector: "app-feeding-nutrition", inputs: ["nutritionTarget", "todayStats", "now", "latestWeightKg", "editing"], outputs: ["goToWeight"] }, { kind: "component", type: FeedingProfileComponent, selector: "app-feeding-profile", inputs: ["user", "profile", "draft", "editing", "maxBirthDate"], outputs: ["save", "cancelEdit", "startEdit", "clearProfile", "draftNameChange", "draftBirthChange", "draftGenderChange"] }, { kind: "component", type: FeedingDialogsComponent, selector: "app-feeding-dialogs", inputs: ["logs", "user", "now", "bottlePrep", "feedingSettings", "prediction", "todayStats", "yesterdayStats", "todayLogs", "yesterdayLogs", "maxBirthDate", "syncError", "syncMessage"], outputs: ["logsChanged", "settingsChanged", "syncErrorChange", "syncMessageChange", "logDialogOpenChange", "bottlePrepClearRequested"] }, { kind: "component", type: FeedingDailyComponent, selector: "app-feeding-daily", inputs: ["logs", "feedingSettings", "now", "nutritionTarget", "user", "syncMessage", "syncError", "logDialogOpen", "loadingLogs", "refreshToken"], outputs: ["logsChanged", "bottlePrepChange", "editLog", "historyOpen", "feedRowClick"] }, { kind: "component", type: HeroHeaderComponent, selector: "app-hero-header", inputs: ["profile", "age", "user", "weightLabel", "isAnyLoading", "showRefresh"], outputs: ["editProfile", "deleteProfile", "openSettings", "openAbout", "refresh"] }, { kind: "component", type: HeroStatsStripComponent, selector: "app-hero-stats-strip", inputs: ["currentTime", "dateLabel", "nextFeedTime", "nextFeedCountdown", "weightLabel", "whoStatus"] }, { kind: "component", type: NotificationBannerComponent, selector: "app-notification-banner", inputs: ["notifications", "saving", "currentUser", "dialogOpen"], outputs: ["openDialog", "closeDialog", "acknowledge", "acknowledgeAll", "delete", "openComposer"] }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1$1.SlicePipe, name: "slice" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
15824
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: FeedingComponent, isStandalone: true, selector: "app-feeding", viewQueries: [{ propertyName: "feedingPageRef", first: true, predicate: ["feedingPage"], descendants: true, static: true }, { propertyName: "documentsCmp", first: true, predicate: DocumentsComponent, descendants: true }, { propertyName: "medicalCmp", first: true, predicate: MedicalHistoryComponent, descendants: true }, { propertyName: "weightCmp", first: true, predicate: WeightComponent, descendants: true }, { propertyName: "feedingDialogs", first: true, predicate: ["feedingDialogs"], descendants: true }], ngImport: i0, template: "<div class=\"feeding-root\">\n <div class=\"feeding-page\" #feedingPage>\n <div class=\"backdrop\"></div>\n\n <header class=\"hero\" [class.hero--profile-merged]=\"profile() && !editing() && ageBreakdown()\">\n @if (profile() && !editing() && ageBreakdown(); as age) {\n <!-- \u2550\u2550 REDESIGNED HERO \u2550\u2550 -->\n <app-hero-header\n [profile]=\"profile()!\"\n [age]=\"age\"\n [user]=\"user()\"\n [weightLabel]=\"profileHeroWeightLabel()\"\n [isAnyLoading]=\"isAnyLoading()\"\n [showRefresh]=\"bottomTab() !== 'schedule'\"\n (openMenu)=\"openSettingsMenu()\"\n (refresh)=\"refreshAll()\"\n >\n <app-activity-log slot=\"activity-log\" (activityChanged)=\"onActivityChanged()\"></app-activity-log>\n </app-hero-header>\n\n <app-hero-stats-strip\n [currentTime]=\"currentTimeStr\"\n [dateLabel]=\"heroDateLabel\"\n [nextFeedTime]=\"prediction()?.nextTime ?? null\"\n [nextFeedCountdown]=\"heroNextFeedCountdown()\"\n [weightLabel]=\"profileHeroWeightLabel()\"\n [whoStatus]=\"nutritionTarget()?.ageLabel ?? null\"\n ></app-hero-stats-strip>\n\n <div class=\"hero-notif-wrap\">\n <app-notification-banner\n [notifications]=\"visibleNotifications()\"\n [saving]=\"notificationSaving()\"\n [currentUser]=\"user()\"\n [dialogOpen]=\"notifDialogOpen()\"\n (openDialog)=\"openNotificationRoute()\"\n (closeDialog)=\"notifDialogOpen.set(false)\"\n (acknowledge)=\"acknowledgeNotification($event)\"\n (acknowledgeAll)=\"notifDialogOpen.set(false); openAcknowledgeAllConfirmDialog()\"\n (delete)=\"deleteNotification($event)\"\n (openComposer)=\"notifDialogOpen.set(false); openNotificationComposerDialog()\"\n ></app-notification-banner>\n </div>\n\n } @else {\n <!-- \u2500\u2500 Fallback: no profile / editing \u2500\u2500 -->\n <div class=\"hero-inner\">\n <div class=\"hero-brand\">\n <div class=\"hero-title-row\">\n <div class=\"hero-title\">\n <div class=\"emoji\" aria-hidden=\"true\">\uD83D\uDC76</div>\n <div class=\"hero-text\">\n <h1>B\u00E9 y\u00EAu c\u1EE7a b\u1EA1n</h1>\n <p class=\"hero-userline\">\n <i class=\"pi pi-user\" aria-hidden=\"true\"></i>\n <strong>{{ user() }}</strong>\n </p>\n </div>\n </div>\n @if (profile() && !editing()) {\n <div class=\"hero-actions\">\n <app-activity-log (activityChanged)=\"onActivityChanged()\"></app-activity-log>\n <button\n class=\"btn icon-btn\"\n type=\"button\"\n (click)=\"feedingDialogs.openFeedingSettingsDialog()\"\n title=\"C\u00E0i \u0111\u1EB7t\"\n aria-label=\"C\u00E0i \u0111\u1EB7t c\u1EEF b\u00FA\"\n >\n <i class=\"pi pi-sliders-h\"></i>\n </button>\n @if (bottomTab() !== 'schedule') {\n <button\n class=\"btn icon-btn\"\n type=\"button\"\n (click)=\"refreshAll()\"\n [disabled]=\"isAnyLoading()\"\n [title]=\"\n isAnyLoading() ? '\u0110ang t\u1EA3i\u2026' : 'T\u1EA3i l\u1EA1i C\u1EEF b\u00FA, C\u00E2n, L\u1ECBch, Y t\u1EBF, T\u00E0i li\u1EC7u'\n \"\n aria-label=\"T\u1EA3i l\u1EA1i C\u1EEF b\u00FA, Th\u1EC3 tr\u1EA1ng, L\u1ECBch, Ti\u1EC1n s\u1EED y t\u1EBF v\u00E0 T\u00E0i li\u1EC7u\"\n >\n <i class=\"pi pi-refresh\" [class.spin]=\"isAnyLoading()\"></i>\n </button>\n }\n </div>\n }\n </div>\n </div>\n\n <div class=\"hero-datetime\" aria-live=\"polite\">\n <div class=\"hero-datetime-strip\">\n <div class=\"hero-datetime-strip__block hero-datetime-strip__block--date\">\n <i class=\"pi pi-calendar\" aria-hidden=\"true\"></i>\n <span class=\"hero-datetime-strip__wd\">{{ heroWeekday }}</span>\n <time class=\"hero-datetime-strip__date\" [attr.datetime]=\"todayDateStr()\">{{\n heroDateNumeric\n }}</time>\n </div>\n <span class=\"hero-datetime-strip__divider\" aria-hidden=\"true\"></span>\n <div class=\"hero-datetime-strip__block hero-datetime-strip__block--time\">\n <i class=\"pi pi-clock\" aria-hidden=\"true\"></i>\n <span class=\"hero-datetime-strip__clock\">{{ currentTimeStr }}</span>\n </div>\n </div>\n </div>\n\n <section class=\"hero-notification\" aria-label=\"Th\u00F4ng b\u00E1o n\u1ED9i b\u1ED9\">\n <!-- watermark background icons -->\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-bell\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-megaphone\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-comments\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--send\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-send\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--star\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-star\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--bolt\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-bolt\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--heart\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-heart\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--info\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-info-circle\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--check\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-check-circle\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--eye\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-eye\"></i>\n </span>\n\n <div class=\"hero-notification__head\">\n <label class=\"hero-notification__composer-label\" for=\"hero-notification-input\">\n <i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i>\n <span>Th\u00F4ng b\u00E1o</span>\n @if (visibleNotifications().length > 0) {\n <span class=\"hero-notification__unread-badge\">{{\n visibleNotifications().length\n }}</span>\n }\n </label>\n <div class=\"hero-notification__head-actions\">\n <button\n type=\"button\"\n class=\"hero-notification__mark-all\"\n (click)=\"openAcknowledgeAllConfirmDialog()\"\n [disabled]=\"notificationSaving() || visibleNotifications().length === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n \u0110\u00E3 \u0111\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button\n type=\"button\"\n class=\"hero-notification__add\"\n (click)=\"openNotificationComposerDialog()\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n title=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n\n @if (displayedNotifications().length > 0) {\n <ul class=\"hero-notification__list\">\n @for (notice of displayedNotifications(); track notice) {\n <li class=\"hero-notification__item\">\n <div class=\"hero-notification__avatar\" aria-hidden=\"true\">\n {{ notice.user | slice: 0 : 2 | uppercase }}\n </div>\n <div class=\"hero-notification__body\">\n <div class=\"hero-notification__body-head\">\n <span class=\"hero-notification__author\">{{ notice.user }}</span>\n </div>\n <p class=\"hero-notification__content\">{{ notice.content }}</p>\n @if (notice.createdAt) {\n <span class=\"hero-notification__created\">{{\n formatNotificationCreatedAt(notice.createdAt)\n }}</span>\n }\n </div>\n <div class=\"hero-notification__item-actions\">\n <button\n type=\"button\"\n class=\"hero-notification__ack-top\"\n (click)=\"acknowledgeNotification(notice)\"\n [disabled]=\"notificationSaving()\"\n aria-label=\"\u0110\u00E3 \u0111\u1ECDc th\u00F4ng b\u00E1o\"\n title=\"\u0110\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDeleteNotification(notice)) {\n <button\n type=\"button\"\n class=\"hero-notification__delete\"\n (click)=\"deleteNotification(notice)\"\n [disabled]=\"notificationSaving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\"\n title=\"X\u00F3a th\u00F4ng b\u00E1o\"\n >\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </li>\n }\n </ul>\n } @else {\n <div class=\"hero-notification__empty\">\n <i class=\"pi pi-bell hero-notification__empty-icon\" aria-hidden=\"true\"></i>\n <span class=\"hero-notification__empty-title\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n <span class=\"hero-notification__empty-sub\"\n >M\u1ECDi th\u1EE9 \u0111\u1EC1u \u1ED5n. Th\u00F4ng b\u00E1o m\u1EDBi s\u1EBD xu\u1EA5t hi\u1EC7n \u1EDF \u0111\u00E2y.</span\n >\n </div>\n }\n\n @if (hiddenNotificationCount() > 0) {\n <button\n type=\"button\"\n class=\"hero-notification__more\"\n (click)=\"openNotificationListDialog()\"\n >\n Xem th\u00EAm {{ hiddenNotificationCount() }} th\u00F4ng b\u00E1o \u2192\n </button>\n }\n </section>\n\n </div>\n } <!-- end @else no-profile -->\n </header>\n\n <!-- \u2550\u2550 NOTIFICATION DIALOGS \u2014 rendered outside <header> to avoid overflow/stacking-context clipping \u2550\u2550 -->\n @if (notificationComposerDialogOpen()) {\n <div\n class=\"dialog-overlay dialog-overlay--front\"\n (click)=\"closeNotificationComposerDialog()\"\n >\n <div\n class=\"dialog hero-notification-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n (click)=\"$event.stopPropagation()\"\n >\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\" aria-hidden=\"true\"><i class=\"pi pi-bell\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\" aria-hidden=\"true\"><i class=\"pi pi-megaphone\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--send\" aria-hidden=\"true\"><i class=\"pi pi-send\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--star\" aria-hidden=\"true\"><i class=\"pi pi-star\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\" aria-hidden=\"true\"><i class=\"pi pi-comments\"></i></span>\n\n <div class=\"dialog-head hero-notification-dialog__head\">\n <div class=\"hero-notification-dialog__title-group\">\n <div class=\"hero-notification-dialog__icon-wrap\">\n <i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i>\n </div>\n <div>\n <h2 class=\"hero-notification-dialog__title\">T\u1EA1o th\u00F4ng b\u00E1o</h2>\n <p class=\"hero-notification-dialog__subtitle\">Th\u00F4ng b\u00E1o s\u1EBD hi\u1EC3n th\u1ECB cho to\u00E0n b\u1ED9 th\u00E0nh vi\u00EAn</p>\n </div>\n </div>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeNotificationComposerDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <div class=\"hero-notification__composer-panel\">\n <div class=\"hero-notification__composer-row\">\n <div class=\"hero-notification__input-wrap\">\n <textarea\n id=\"hero-notification-input\"\n class=\"hero-notification__input\"\n [value]=\"notificationDraft()\"\n (input)=\"updateNotificationDraft($any($event.target).value)\"\n [disabled]=\"notificationSaving()\"\n maxlength=\"300\"\n placeholder=\"Nh\u1EADp n\u1ED9i dung th\u00F4ng b\u00E1o cho m\u1ECDi ng\u01B0\u1EDDi...\"\n aria-label=\"N\u1ED9i dung th\u00F4ng b\u00E1o\"\n ></textarea>\n <div class=\"hero-notification__char-ring\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 36 36\">\n <circle class=\"hero-notification__char-ring-track\" cx=\"18\" cy=\"18\" r=\"15\" />\n <circle class=\"hero-notification__char-ring-fill\" cx=\"18\" cy=\"18\" r=\"15\"\n [style.stroke-dashoffset]=\"94 - (notificationDraft().trim().length / 300) * 94\" />\n </svg>\n <span class=\"hero-notification__char-count\">{{ notificationDraft().trim().length }}</span>\n </div>\n </div>\n </div>\n <div class=\"hero-notification__composer-actions\">\n <button type=\"button\" class=\"btn ghost hero-notification__cancel\"\n (click)=\"closeNotificationComposerDialog()\" [disabled]=\"notificationSaving()\">H\u1EE7y</button>\n <button type=\"button\" class=\"btn hero-notification__send\"\n (click)=\"createNotification()\"\n [disabled]=\"notificationSaving() || !notificationDraft().trim()\">\n <i class=\"pi pi-send\"></i>\n <span>G\u1EEDi th\u00F4ng b\u00E1o</span>\n </button>\n </div>\n </div>\n @if (notificationError()) {\n <p class=\"hero-notification__error\">{{ notificationError() }}</p>\n }\n </div>\n </div>\n }\n\n @if (notificationListDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeNotificationListDialog()\">\n <div class=\"dialog hero-notification-list-dialog\" role=\"dialog\" aria-modal=\"true\"\n aria-label=\"Danh s\u00E1ch th\u00F4ng b\u00E1o\" (click)=\"$event.stopPropagation()\">\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\" aria-hidden=\"true\"><i class=\"pi pi-bell\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\" aria-hidden=\"true\"><i class=\"pi pi-megaphone\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\" aria-hidden=\"true\"><i class=\"pi pi-comments\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--star\" aria-hidden=\"true\"><i class=\"pi pi-star\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--check\" aria-hidden=\"true\"><i class=\"pi pi-check-circle\"></i></span>\n\n <div class=\"dialog-head hero-notification-list-dialog__head\">\n <div class=\"hero-notification-dialog__title-group\">\n <div class=\"hero-notification-dialog__icon-wrap\"><i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i></div>\n <div>\n <h2 class=\"hero-notification-list-dialog__title\">To\u00E0n b\u1ED9 th\u00F4ng b\u00E1o</h2>\n <p class=\"hero-notification-dialog__subtitle\">{{ visibleNotifications().length }} th\u00F4ng b\u00E1o</p>\n </div>\n </div>\n <div class=\"hero-notification-list-dialog__head-actions\">\n <button type=\"button\" class=\"hero-notification__mark-all\"\n (click)=\"openAcknowledgeAllConfirmDialog()\"\n [disabled]=\"notificationSaving() || visibleNotifications().length === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\">\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i> \u0110\u00E3 \u0111\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeNotificationListDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n </div>\n <div class=\"hero-notification-list-dialog__body\">\n @if (visibleNotifications().length > 0) {\n <ul class=\"hero-notification__list\">\n @for (notice of visibleNotifications(); track notice) {\n <li class=\"hero-notification__item\">\n <div class=\"hero-notification__avatar\" aria-hidden=\"true\">{{ notice.user | slice: 0 : 2 | uppercase }}</div>\n <div class=\"hero-notification__body\">\n <div class=\"hero-notification__body-head\">\n <span class=\"hero-notification__author\">{{ notice.user }}</span>\n </div>\n <p class=\"hero-notification__content\">{{ notice.content }}</p>\n @if (notice.createdAt) {\n <span class=\"hero-notification__created\">{{ formatNotificationCreatedAt(notice.createdAt) }}</span>\n }\n </div>\n <div class=\"hero-notification__item-actions\">\n <button type=\"button\" class=\"hero-notification__ack-top\"\n (click)=\"acknowledgeNotification(notice)\" [disabled]=\"notificationSaving()\"\n aria-label=\"\u0110\u00E3 \u0111\u1ECDc th\u00F4ng b\u00E1o\" title=\"\u0110\u00E3 \u0111\u1ECDc\">\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDeleteNotification(notice)) {\n <button type=\"button\" class=\"hero-notification__delete\"\n (click)=\"deleteNotification(notice)\" [disabled]=\"notificationSaving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\" title=\"X\u00F3a th\u00F4ng b\u00E1o\">\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </li>\n }\n </ul>\n } @else {\n <div class=\"hero-notification__empty\">\n <i class=\"pi pi-bell hero-notification__empty-icon\" aria-hidden=\"true\"></i>\n <span class=\"hero-notification__empty-title\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n <span class=\"hero-notification__empty-sub\">M\u1ECDi th\u1EE9 \u0111\u1EC1u \u1ED5n. Th\u00F4ng b\u00E1o m\u1EDBi s\u1EBD xu\u1EA5t hi\u1EC7n \u1EDF \u0111\u00E2y.</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n\n @if (acknowledgeAllConfirmDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeAcknowledgeAllConfirmDialog()\">\n <div class=\"dialog ack-all-confirm-dialog\" role=\"alertdialog\" aria-modal=\"true\"\n aria-labelledby=\"ack-all-confirm-title\" (click)=\"$event.stopPropagation()\">\n <div class=\"ack-all-confirm-dialog__icon-wrap\" aria-hidden=\"true\"><i class=\"pi pi-check-circle\"></i></div>\n <h2 id=\"ack-all-confirm-title\" class=\"ack-all-confirm-dialog__title\">\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc?</h2>\n <p class=\"ack-all-confirm-dialog__desc\">\n T\u1EA5t c\u1EA3 {{ visibleNotifications().length }} th\u00F4ng b\u00E1o s\u1EBD \u0111\u01B0\u1EE3c \u0111\u00E1nh d\u1EA5u \u0111\u00E3 \u0111\u1ECDc v\u00E0 \u1EA9n kh\u1ECFi danh s\u00E1ch.\n </p>\n <div class=\"ack-all-confirm-dialog__actions\">\n <button type=\"button\" class=\"btn ghost\" (click)=\"closeAcknowledgeAllConfirmDialog()\" [disabled]=\"notificationSaving()\">H\u1EE7y</button>\n <button type=\"button\" class=\"btn ack-all-confirm-dialog__confirm-btn\"\n (click)=\"confirmAcknowledgeAll()\" [disabled]=\"notificationSaving()\">\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i> X\u00E1c nh\u1EADn\n </button>\n </div>\n </div>\n </div>\n }\n\n <main\n class=\"content\"\n [class.is-documents]=\"bottomTab() === 'documents'\"\n [class.is-weight]=\"bottomTab() === 'weight'\"\n [class.is-schedule]=\"bottomTab() === 'schedule'\"\n [class.is-mom]=\"bottomTab() === 'mom'\"\n [class.is-medical]=\"bottomTab() === 'medical'\"\n >\n <!--\n ============ TAB PANES ============\n D\u00F9ng `[hidden]` thay v\u00EC `*ngIf` \u0111\u1EC3 c\u00E1c tab c\u00F9ng gi\u1EEF tr\u1EA1ng th\u00E1i khi\n user qua l\u1EA1i: scroll position, search query \u0111ang g\u00F5, viewMode, folder\n \u0111ang \u0111\u1EE9ng, file \u0111ang ch\u1ECDn, draft \u0111ang nh\u1EADp\u2026 \u0111\u1EC1u kh\u00F4ng b\u1ECB reset. H\u1EC7\n qu\u1EA3: `<app-documents>` \u0111\u01B0\u1EE3c mount 1 l\u1EA7n \u1EDF app load \u2014 `loadEntries()`\n ch\u1EA1y 1 l\u1EA7n, c\u00E1c l\u1EA7n switch tab k\u1EBF ti\u1EBFp kh\u00F4ng g\u1ECDi API th\u00EAm.\n -->\n <!-- ============ TAB: DOCUMENTS \u2014 \u0111\u00E3 chuy\u1EC3n sang subroute (m\u1EDF t\u1EEB Settings menu) ============ -->\n\n <!-- ============ TAB: WEIGHT ============ -->\n <div class=\"tab-pane tab-pane--weight\" [hidden]=\"bottomTab() !== 'weight'\">\n <app-weight\n [user]=\"user()\"\n [birthDate]=\"profile()?.birthDate\"\n [gender]=\"profile()?.gender\"\n [babyName]=\"profile()?.babyName\"\n ></app-weight>\n </div>\n\n <!-- ============ TAB: L\u1ECACH \u2014 Google Sheet tab \"Event\" ============ -->\n <div class=\"tab-pane tab-pane--schedule\" [hidden]=\"bottomTab() !== 'schedule'\">\n <app-feeding-schedule [user]=\"user()\"></app-feeding-schedule>\n </div>\n\n <!-- ============ TAB: TI\u1EC0N S\u1EEC Y T\u1EBE \u2014 Medical history V2 ============ -->\n <div class=\"tab-pane tab-pane--medical\" [hidden]=\"bottomTab() !== 'medical'\">\n <app-medical-history\n [user]=\"user()\"\n (openExplorerFile)=\"openMedicalAttachmentInDocuments($event)\"\n ></app-medical-history>\n </div>\n\n <!-- ============ TAB: M\u1EB8 \u2014 \u0111\u00E3 chuy\u1EC3n sang subroute (m\u1EDF t\u1EEB Settings menu) ============ -->\n\n <!-- ============ TAB: FEEDING ============ -->\n <div class=\"tab-pane tab-pane--feeding\" [hidden]=\"bottomTab() !== 'feeding'\">\n <app-feeding-profile\n [user]=\"user()\"\n [profile]=\"profile()\"\n [draft]=\"draft()\"\n [editing]=\"editing()\"\n [maxBirthDate]=\"maxBirthDate\"\n (save)=\"save()\"\n (cancelEdit)=\"cancelEdit()\"\n (startEdit)=\"startEdit()\"\n (clearProfile)=\"clearProfile()\"\n (draftNameChange)=\"updateDraftName($event)\"\n (draftBirthChange)=\"updateDraftBirth($event)\"\n (draftGenderChange)=\"setDraftGender($event)\"\n />\n\n @if (profile() && !editing() && ageBreakdown()) {\n <app-feeding-daily\n [logs]=\"logs()\"\n [feedingSettings]=\"feedingSettings()\"\n [now]=\"now()\"\n [nutritionTarget]=\"nutritionTarget()\"\n [user]=\"user()\"\n [syncMessage]=\"syncMessage()\"\n [syncError]=\"syncError()\"\n [logDialogOpen]=\"logDialogOpen()\"\n [loadingLogs]=\"loadingLogs()\"\n [refreshToken]=\"dailyRefreshToken()\"\n (logsChanged)=\"onFeedingLogsChanged()\"\n (bottlePrepChange)=\"bottlePrep.set($event)\"\n (editLog)=\"feedingDialogs.openEditDialog($event)\"\n (historyOpen)=\"feedingDialogs.openHistoryDialog($event.filter, $event.dateStr)\"\n (feedRowClick)=\"feedingDialogs.onFeedRowClick($event)\"\n >\n <app-feeding-charts\n data-feeding-charts\n [logs]=\"logs()\"\n [now]=\"now()\"\n [nutritionTarget]=\"nutritionTarget()\"\n />\n </app-feeding-daily>\n <app-feeding-nutrition\n [nutritionTarget]=\"nutritionTarget()\"\n [todayStats]=\"todayStats()\"\n [now]=\"now()\"\n [latestWeightKg]=\"latestWeightKgFromSheet()\"\n [editing]=\"editing()\"\n (goToWeight)=\"setBottomTab('weight')\"\n />\n }\n\n <!-- ============ FAB \u00AB Ghi c\u1EEF b\u00FA \u00BB c\u0169 \u0111\u00E3 \u0111\u01B0\u1EE3c thay b\u1EB1ng FAB gi\u1EEFa bottom-nav ============ -->\n </div>\n <!-- /.tab-pane--feeding -->\n </main>\n </div>\n <!-- /.feeding-page -->\n\n <!-- ============ BOTTOM NAVIGATION (C\u1EEF b\u00FA \u00B7 Th\u1EC3 tr\u1EA1ng \u00B7 + \u00B7 L\u1ECBch \u00B7 Y t\u1EBF) ============ -->\n <nav\n class=\"bottom-nav\"\n role=\"tablist\"\n aria-label=\"\u0110i\u1EC1u h\u01B0\u1EDBng ch\u00EDnh\"\n >\n <div class=\"bn-side bn-side--left\">\n @for (tab of navLeftTabs(); track tab.id) {\n <button\n type=\"button\"\n class=\"bn-item\"\n role=\"tab\"\n [attr.aria-selected]=\"bottomTab() === tab.id\"\n [class.active]=\"bottomTab() === tab.id\"\n (click)=\"setBottomTab(tab.id)\"\n >\n <span class=\"bn-icon-wrap\">\n <i class=\"pi {{ tab.icon }} bn-icon\" aria-hidden=\"true\"></i>\n </span>\n <span class=\"bn-label\">{{ tab.label }}</span>\n </button>\n }\n </div>\n\n <button\n type=\"button\"\n class=\"bn-fab\"\n (click)=\"feedingDialogs.openLogDialog()\"\n [disabled]=\"!profile() || editing()\"\n [title]=\"(!profile() || editing()) ? 'Ch\u1ECDn b\u00E9 tr\u01B0\u1EDBc khi ghi c\u1EEF b\u00FA' : 'Ghi nh\u1EADn c\u1EEF b\u00FA m\u1EDBi'\"\n aria-label=\"Ghi nh\u1EADn c\u1EEF b\u00FA\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n\n <div class=\"bn-side bn-side--right\">\n @for (tab of navRightTabs(); track tab.id) {\n <button\n type=\"button\"\n class=\"bn-item\"\n role=\"tab\"\n [attr.aria-selected]=\"bottomTab() === tab.id\"\n [class.active]=\"bottomTab() === tab.id\"\n (click)=\"setBottomTab(tab.id)\"\n >\n <span class=\"bn-icon-wrap\">\n <i class=\"pi {{ tab.icon }} bn-icon\" aria-hidden=\"true\"></i>\n </span>\n <span class=\"bn-label\">{{ tab.label }}</span>\n </button>\n }\n </div>\n </nav>\n\n <!-- ============ NOTIFICATION SUBROUTE (full-screen) ============ -->\n @if (notifRouteOpen()) {\n <app-notification-list\n [notifications]=\"allNotifications()\"\n [currentUser]=\"user()\"\n [saving]=\"notificationSaving()\"\n (back)=\"closeNotificationRoute()\"\n (acknowledge)=\"acknowledgeNotification($event)\"\n (acknowledgeAll)=\"openAcknowledgeAllConfirmDialog()\"\n (delete)=\"deleteNotification($event)\"\n (openComposer)=\"openNotificationComposerDialog()\"\n />\n }\n\n <!-- ============ SETTINGS FLOAT MENU (full-screen) ============ -->\n @if (settingsMenuOpen()) {\n <app-settings-menu\n [appName]=\"appInfo.name\"\n [appVersion]=\"appInfo.version\"\n [showDocuments]=\"explorerEnabled\"\n [unreadCount]=\"visibleNotifications().length\"\n (close)=\"closeSettingsMenu()\"\n (select)=\"onSettingsMenuSelect($event)\"\n />\n }\n\n <!-- ============ M\u1EB8 SUBROUTE (full-screen) ============ -->\n @if (momRouteOpen()) {\n <app-subroute-shell\n title=\"M\u1EB9\"\n (back)=\"closeMomRoute()\"\n >\n <app-feeding-mom\n [profile]=\"profile()\"\n [editing]=\"editing()\"\n (goToFeeding)=\"closeMomRoute(); setBottomTab('feeding')\"\n ></app-feeding-mom>\n </app-subroute-shell>\n }\n\n <!-- ============ T\u00C0I LI\u1EC6U SUBROUTE (full-screen) ============ -->\n @if (documentsRouteOpen()) {\n <app-subroute-shell\n title=\"T\u00E0i li\u1EC7u\"\n (back)=\"closeDocumentsRoute()\"\n >\n <app-documents></app-documents>\n </app-subroute-shell>\n }\n\n <!-- About -->\n @if (aboutDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeAboutDialog()\">\n <div\n class=\"dialog about-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby=\"feeding-about-title\"\n (click)=\"$event.stopPropagation()\"\n >\n <div class=\"dialog-head about-dialog__head\">\n <h2 id=\"feeding-about-title\" class=\"about-dialog__title\">\n <i class=\"pi pi-info-circle\" aria-hidden=\"true\"></i>\n About\n </h2>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeAboutDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <dl class=\"about-dialog__meta\">\n <div class=\"about-dialog__row\">\n <dt>\u1EE8ng d\u1EE5ng</dt>\n <dd>{{ appInfo.name }}</dd>\n </div>\n <div class=\"about-dialog__row\">\n <dt>Phi\u00EAn b\u1EA3n</dt>\n <dd>\n <code>{{ appInfo.version }}</code>\n </dd>\n </div>\n </dl>\n <div class=\"dialog-actions\">\n <button type=\"button\" class=\"btn primary\" (click)=\"closeAboutDialog()\">\u0110\u00F3ng</button>\n </div>\n </div>\n </div>\n }\n\n <!-- Nh\u1EAFc s\u1EF1 ki\u1EC7n l\u1ECBch (sheet Event + Settings) -->\n @if (eventReminderDialogOpen() && scheduleReminderEvents().length > 0) {\n <div\n class=\"dialog-overlay dialog-overlay--front dialog-overlay--event-reminder\"\n (click)=\"closeEventReminderDialog()\"\n >\n <div\n class=\"dialog event-reminder-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n (click)=\"$event.stopPropagation()\"\n >\n <div class=\"dialog-head event-reminder-dialog__head\">\n <h2 class=\"event-reminder-dialog__title\">\n <i class=\"pi pi-bell\" aria-hidden=\"true\"></i>\n B\u1EA1n c\u00F3 l\u1ECBch s\u1EAFp t\u1EDBi\n </h2>\n <button\n type=\"button\"\n class=\"dialog-close\"\n (click)=\"closeEventReminderDialog()\"\n aria-label=\"\u0110\u00F3ng\"\n >\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <ul class=\"event-reminder-list\">\n @for (ev of scheduleReminderEvents(); track ev) {\n <li>\n <article class=\"event-reminder-card\">\n <h3 class=\"event-reminder-card__title\">{{ ev.title }}</h3>\n <p class=\"event-reminder-card__datetime\">\n <span class=\"event-reminder-card__date\">{{ formatReminderEventWhen(ev) }}</span>\n <span class=\"event-reminder-card__sep\" aria-hidden=\"true\"> \u2013 </span>\n <span class=\"event-reminder-card__hour\">{{\n formatReminderEventTime(ev.time)\n }}</span>\n </p>\n @if (ev.place) {\n <p class=\"event-reminder-card__place\">\n <i class=\"pi pi-map-marker\" aria-hidden=\"true\"></i>\n <span>{{ ev.place }}</span>\n </p>\n }\n @if (ev.note) {\n <div class=\"event-reminder-card__content-wrap\">\n <span class=\"event-reminder-card__content-label\">N\u1ED9i dung</span>\n <p class=\"event-reminder-card__content\">{{ ev.note }}</p>\n </div>\n }\n </article>\n </li>\n }\n </ul>\n <div class=\"dialog-actions event-reminder-actions\">\n <button\n type=\"button\"\n class=\"event-reminder-actions__link\"\n (click)=\"acknowledgeAllEventReminders()\"\n >\n Kh\u00F4ng nh\u1EAFc l\u1EA1i\n </button>\n <button\n type=\"button\"\n class=\"btn primary event-reminder-actions__primary\"\n (click)=\"skipEventReminderSession()\"\n >\n \u0110\u00E3 hi\u1EC3u\n </button>\n </div>\n </div>\n </div>\n }\n\n <app-feeding-dialogs\n #feedingDialogs\n [logs]=\"logs()\"\n [user]=\"user()\"\n [now]=\"now()\"\n [bottlePrep]=\"bottlePrep()\"\n [feedingSettings]=\"feedingSettings()\"\n [prediction]=\"prediction()\"\n [todayStats]=\"todayStats()\"\n [yesterdayStats]=\"yesterdayStats()\"\n [todayLogs]=\"todayLogs()\"\n [yesterdayLogs]=\"yesterdayLogs()\"\n [maxBirthDate]=\"maxBirthDate\"\n [syncError]=\"syncError()\"\n [syncMessage]=\"syncMessage()\"\n (logsChanged)=\"onFeedingLogsChanged()\"\n (settingsChanged)=\"onFeedingSettingsChanged($event)\"\n (syncErrorChange)=\"syncError.set($event)\"\n (syncMessageChange)=\"syncMessage.set($event)\"\n (logDialogOpenChange)=\"logDialogOpen.set($event)\"\n (bottlePrepClearRequested)=\"clearBottlePrep()\"\n />\n</div>\n<!-- /.feeding-root -->\n", styles: ["@charset \"UTF-8\";:host{display:flex;flex-direction:column;position:absolute;inset:0;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--border-strong: #d1d5db;--primary: #5b6cff;--primary-2: #4c5cf0;--primary-soft: #eef0ff;--accent: #ff5c8a;--accent-soft: #ffe7ef;--mint: #10b981;--mint-soft: #d1fae5;--amber: #f59e0b;--amber-soft: #fef3c7;--rose: #ef4444;--rose-soft: #fee2e2;--text: #0f172a;--muted: #64748b;--muted-2: #94a3b8}.feeding-root{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;position:relative}.feeding-root .bp-prep-user{font-weight:800;color:#0369a1;background:#0ea5e933;padding:0 5px;margin-right:2px;border-radius:5px;white-space:nowrap;transition:color .2s,background .2s}.feeding-root .bp-prep-time{font-weight:800;font-variant-numeric:tabular-nums;color:#0284c7;background:linear-gradient(180deg,#f0f9ff,#e0f2fe);border:1px solid rgba(14,165,233,.35);padding:1px 7px;margin-left:2px;border-radius:6px;white-space:nowrap;box-shadow:0 1px #ffffffa6 inset;transition:color .2s,background .2s,border-color .2s}.feeding-page{position:relative;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;color:var(--text);padding-bottom:calc(170px + env(safe-area-inset-bottom,0px))}.backdrop{position:fixed;inset:0;background:var(--bg);z-index:-1}.hero-notif-wrap{padding:0 16px 8px}.hero{padding:0;background:#fffffff5;border-bottom:1px solid rgba(226,232,240,.9)}@media(max-width:640px){.hero{padding-top:calc(26px + env(safe-area-inset-top,0px));padding-bottom:10px}}.hero-inner{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 18px}.hero-brand{min-width:0}.hero-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;width:100%}.hero-title{display:flex;align-items:center;gap:12px;min-width:0;flex:1}.hero-title .emoji{font-size:36px;line-height:1;flex-shrink:0;filter:drop-shadow(0 2px 4px rgba(15,23,42,.08))}@media(max-width:640px){.hero-title .emoji{font-size:32px}}.hero-title .hero-text{min-width:0}.hero-title h1{margin:0;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.02em;line-height:1.2}@media(max-width:640px){.hero-title h1{font-size:17px}}.hero-title .hero-userline{margin:5px 0 0;display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 6px;font-size:12.5px;color:var(--muted)}.hero-title .hero-userline i{font-size:12px;color:var(--primary);opacity:.9}.hero-title .hero-userline strong{color:var(--primary);font-weight:700;letter-spacing:.01em}.hero-title .hero-userline .hero-last-update{font-size:11px;color:#94a3b8;font-weight:400}.hero--profile-merged{background:var(--primary-soft);padding-bottom:10px;margin-bottom:8px}.hero-title--merged{align-items:flex-start}.hero-title--merged .emoji{font-size:30px}.hero-title--merged h1{font-size:18px;line-height:1.15}.hero-merged-head{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;min-width:0;row-gap:6px}.hero-age-chip{font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:lowercase;color:var(--primary);background:var(--primary-soft);padding:3px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--primary) 18%,transparent);white-space:nowrap}.hero-merged-stat{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:6px;font-size:11px;font-weight:700;color:var(--muted);background:#94a3b824;border:1px solid rgba(148,163,184,.28);white-space:nowrap;line-height:1.25}.hero-merged-stat>i{font-size:10px;opacity:.88;color:var(--muted-2)}.hero-merged-stat--weight>i{color:var(--accent);opacity:1}.hero-merged-meta{margin:5px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:2px 4px;font-size:11.5px;line-height:1.45;color:var(--muted)}.hero-merged-meta .dot{color:var(--muted-2);font-weight:700;-webkit-user-select:none;user-select:none}.hero-merged-meta i{font-size:10px;margin-right:3px;color:var(--muted-2);opacity:.95}.hero-merged-meta strong{color:var(--primary);font-weight:700}.hero-merged-sync{color:#94a3b8;font-weight:400;font-size:11px}.hero-actions--merged{flex-shrink:0}.hero-profile-menu{position:relative;flex:0 0 auto;list-style:none}.hero-profile-menu__trigger{list-style:none}.hero-profile-menu__trigger::-webkit-details-marker{display:none}.hero-profile-menu__trigger::marker{content:\"\"}.hero-profile-menu__panel{position:absolute;top:calc(100% + 6px);right:0;z-index:30;min-width:180px;padding:6px;border-radius:12px;border:1px solid var(--border);background:#fff;box-shadow:0 8px 24px -8px #0f172a2e}.hero-profile-menu__item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:8px;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--text);text-align:left;cursor:pointer;transition:background .12s ease,color .12s ease}.hero-profile-menu__item i{font-size:14px;color:var(--muted-2);width:1.1em;text-align:center}.hero-profile-menu__item:hover:not(:disabled){background:var(--primary-soft, #eef0ff);color:var(--primary)}.hero-profile-menu__item:hover:not(:disabled) i{color:var(--primary)}.hero-profile-menu__item--danger:hover:not(:disabled){color:var(--rose);background:var(--rose-soft)}.hero-profile-menu__item--danger:hover:not(:disabled) i{color:var(--rose)}.about-dialog{max-width:360px}.about-dialog__head{margin-bottom:8px}.about-dialog__title{display:flex;align-items:center;gap:8px;margin:0;font-size:18px;font-weight:700}.about-dialog__title i{color:var(--primary)}.about-dialog__meta{margin:0 0 16px;padding:0}.about-dialog__row{display:grid;grid-template-columns:96px 1fr;gap:8px 12px;padding:10px 0;border-bottom:1px solid var(--border)}.about-dialog__row:last-child{border-bottom:0}.about-dialog__row dt{margin:0;font-size:13px;font-weight:600;color:var(--muted-2)}.about-dialog__row dd{margin:0;font-size:14px;font-weight:600;color:var(--text)}.about-dialog__row dd code{font-size:13px;font-weight:600;padding:2px 8px;border-radius:6px;background:var(--primary-soft, #eef0ff);color:var(--primary)}@media(max-width:640px){.hero-title--merged .emoji{font-size:26px}.hero-merged-meta{font-size:11px}.hero-merged-stat{font-size:10.5px;padding:2px 7px}}.hero-datetime{display:flex;flex-wrap:wrap;align-items:center;flex-shrink:0}.hero-datetime-strip{display:inline-flex;align-items:stretch;flex-wrap:nowrap;max-width:100%;min-height:34px;border:1px solid var(--border);border-radius:8px;background:linear-gradient(180deg,#fff,#f1f5f9);box-shadow:0 1px 1px #0f172a0d}.hero-datetime-strip__block{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;min-width:0}.hero-datetime-strip__block>.pi{font-size:12px;color:var(--primary);opacity:.82;flex-shrink:0}.hero-datetime-strip__block--date{flex-wrap:wrap;row-gap:0}.hero-datetime-strip__wd{font-size:10px;font-weight:700;color:var(--muted);text-transform:capitalize;letter-spacing:.02em;line-height:1.15;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero-datetime-strip__date{font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--text);letter-spacing:.02em;white-space:nowrap}.hero-datetime-strip__divider{align-self:stretch;width:1px;margin:5px 0;background:#94a3b866;flex-shrink:0}.hero-datetime-strip__clock{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.04em;color:var(--primary);line-height:1;white-space:nowrap}.hero-datetime-strip__block--time{padding-right:10px}.hero-datetime-strip__block--time>.pi{font-size:11px}@media(max-width:520px){.hero-inner{flex-direction:column;align-items:stretch}.hero-datetime{width:100%;justify-content:flex-start}.hero-datetime-strip{flex:1 1 auto;width:100%;justify-content:space-between}.hero-notification__composer-row{flex-direction:column;align-items:stretch}.hero-notification__send,.hero-notification__cancel{width:100%;justify-content:center}}.hero-notification__bg-icon{position:absolute;pointer-events:none;color:var(--primary);opacity:.13;line-height:1}.hero-notification__bg-icon i{display:block}.hero-notification__bg-icon--bell{top:8%;left:6%;font-size:28px;transform:rotate(-18deg)}.hero-notification__bg-icon--megaphone{top:10%;right:8%;font-size:24px;transform:rotate(12deg)}.hero-notification__bg-icon--comments{bottom:14%;right:10%;font-size:22px;transform:rotate(-8deg)}.hero-notification__bg-icon--send{bottom:10%;left:50%;font-size:20px;transform:rotate(-22deg)}.hero-notification__bg-icon--star{bottom:16%;left:4%;font-size:18px;transform:rotate(20deg)}.hero-notification__bg-icon--bolt{top:46%;right:2%;font-size:20px;transform:rotate(-5deg)}.hero-notification__bg-icon--heart{top:38%;left:14%;font-size:17px;transform:rotate(15deg)}.hero-notification__bg-icon--info{top:4%;left:50%;font-size:18px;transform:rotate(0)}.hero-notification__bg-icon--check{bottom:24%;left:35%;font-size:17px;transform:rotate(8deg)}.hero-notification__bg-icon--eye{top:14%;left:28%;font-size:18px;transform:rotate(-10deg)}.hero-notification{flex:1 1 100%;display:flex;flex-direction:column;gap:10px;margin-top:2px;padding:10px 12px;border:1px solid rgba(148,163,184,.28);border-radius:14px;background:#fff;position:relative;overflow:hidden}.hero-notification__head{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative}.hero-notification__head-actions{display:inline-flex;align-items:center;gap:6px}.hero-notification__composer-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}.hero-notification__composer-label i{color:var(--primary);font-size:12px}.hero-notification__unread-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--primary);color:#fff;font-size:10px;font-weight:700;line-height:1}.hero-notification__add{width:28px;height:28px;border:1px solid rgba(var(--primary-rgb, 76, 92, 240),.25);border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.1);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}.hero-notification__add i{font-size:11px}.hero-notification__add:hover:not(:disabled){background:var(--primary);border-color:var(--primary);color:#fff}.hero-notification__mark-all{height:26px;border:none;border-radius:0;background:transparent;color:var(--primary);font-size:11px;font-weight:600;padding:0;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:4px}.hero-notification__mark-all i{font-size:10px}.hero-notification__mark-all:hover:not(:disabled){opacity:.75}.hero-notification__mark-all:disabled{color:var(--muted-2);cursor:default}.hero-notification__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;position:relative}.hero-notification__item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid #e2e8f0;position:relative;transition:border-color .18s ease,transform .18s ease}@media(hover:hover){.hero-notification__item:hover{border-color:#c7d2fe;transform:translateY(-1px)}}.hero-notification__avatar{width:34px;height:34px;border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.12);border:1.5px solid rgba(var(--primary-rgb, 76, 92, 240),.22);color:var(--primary);font-size:11px;font-weight:700;letter-spacing:.5px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.hero-notification__body{flex:1;min-width:0;padding-right:52px}.hero-notification__body-head{display:flex;align-items:center;gap:6px;margin-bottom:3px}.hero-notification__author{font-size:12px;font-weight:700;color:var(--text)}.hero-notification__content{margin:0;font-size:13.5px;line-height:1.5;color:var(--text);white-space:pre-wrap;word-break:break-word}.hero-notification__created{display:block;margin-top:4px;font-size:11px;color:#94a3b8;font-variant-numeric:tabular-nums}.hero-notification__item-actions{position:absolute;top:7px;right:8px;display:inline-flex;align-items:center;gap:4px}.hero-notification__ack-top{width:24px;height:24px;border:none;border-radius:50%;background:#eff6ff;color:#1d4ed8;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease}.hero-notification__ack-top i{font-size:10px}.hero-notification__ack-top:active:not(:disabled){transform:scale(.96)}.hero-notification__ack-top:hover:not(:disabled){background:#dbeafe;color:#1e40af}.hero-notification__delete{width:24px;height:24px;border:none;border-radius:50%;background:transparent;color:#94a3b8;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.hero-notification__delete i{font-size:10px}.hero-notification__delete:hover:not(:disabled){background:#fee2e2;color:#b91c1c}.hero-notification__empty{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 8px;position:relative}.hero-notification__empty-icon{font-size:28px;color:var(--primary);opacity:.45;margin-bottom:4px}.hero-notification__empty-title{font-size:13px;font-weight:600;color:var(--muted)}.hero-notification__empty-sub{font-size:11px;color:var(--muted-2);text-align:center}.hero-notification__more{align-self:flex-start;border:none;background:transparent;color:var(--primary);font-size:12px;font-weight:700;cursor:pointer;padding:0;font-family:inherit;position:relative}.hero-notification__more:hover{opacity:.75}.hero-notification__composer-row{display:flex;align-items:stretch;gap:8px;min-width:0}.hero-notification__composer-panel{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid #dbe4f3;border-radius:12px;background:#f8fbff}.hero-notification__input-wrap{flex:1;min-width:0;border-radius:11px;border:1.5px solid #cfd8e6;background:#fff;transition:border-color .15s ease;position:relative}.hero-notification__composer-row:focus-within .hero-notification__input-wrap{border-color:var(--primary)}.hero-notification__input{width:100%;min-width:0;min-height:100px;border:0;border-radius:11px;padding:10px 12px 32px;font-size:13px;line-height:1.45;color:var(--text);background:transparent;font-family:inherit;resize:vertical}.hero-notification__input:focus{outline:none}.hero-notification__char-ring{position:absolute;bottom:8px;right:10px;display:flex;align-items:center;gap:4px;pointer-events:none}.hero-notification__char-ring svg{width:22px;height:22px;transform:rotate(-90deg)}.hero-notification__char-ring-track{fill:none;stroke:#e2e8f0;stroke-width:3}.hero-notification__char-ring-fill{fill:none;stroke:var(--primary);stroke-width:3;stroke-dasharray:94 94;stroke-linecap:round;transition:stroke-dashoffset .2s ease}.hero-notification__char-count{font-size:10px;color:var(--muted-2);font-variant-numeric:tabular-nums}.hero-notification__composer-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.hero-notification__send,.hero-notification__cancel{height:36px;border-radius:10px;min-width:86px;padding:0 14px;font-size:12px;font-weight:700}.hero-notification__send{background:var(--primary);color:#fff}.hero-notification__send:not(:disabled):hover{background:var(--primary-2)}.hero-notification__cancel{min-width:72px}.hero-notification__error{margin:0;font-size:12px;color:#b91c1c;position:relative}.hero-notification-dialog{max-width:min(520px,100vw - 24px);overflow:hidden}.hero-notification-dialog .hero-notification__composer-row{align-items:stretch;gap:10px}.hero-notification-dialog .hero-notification__input-wrap{min-height:110px}.hero-notification-dialog__head{margin-bottom:14px}.hero-notification-dialog__title-group{display:flex;align-items:flex-start;gap:10px}.hero-notification-dialog__icon-wrap{width:34px;height:34px;border-radius:10px;background:rgba(var(--primary-rgb, 76, 92, 240),.12);border:1px solid rgba(var(--primary-rgb, 76, 92, 240),.22);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.hero-notification-dialog__icon-wrap i{font-size:14px}.hero-notification-dialog__title{margin:0;font-size:15px;font-weight:800;color:var(--text);line-height:1.3}.hero-notification-dialog__subtitle{margin:2px 0 0;font-size:11px;color:var(--muted-2)}.hero-notification-list-dialog{max-width:min(620px,100vw - 24px)}.hero-notification-list-dialog__head{margin-bottom:10px;align-items:flex-start}.hero-notification-list-dialog__head-actions{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}.hero-notification-list-dialog__title{margin:0;font-size:15px;font-weight:800;color:var(--text);line-height:1.3}.hero-notification-list-dialog__body{max-height:min(60vh,480px);overflow-y:auto;padding-right:2px}.ack-all-confirm-dialog{max-width:min(380px,100vw - 24px);text-align:center;padding:28px 24px 24px;display:flex;flex-direction:column;align-items:center;gap:10px;overflow:hidden}.ack-all-confirm-dialog__icon-wrap{width:52px;height:52px;border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.1);border:1.5px solid rgba(var(--primary-rgb, 76, 92, 240),.2);color:var(--primary);display:flex;align-items:center;justify-content:center;margin-bottom:2px}.ack-all-confirm-dialog__icon-wrap i{font-size:22px}.ack-all-confirm-dialog__title{margin:0;font-size:16px;font-weight:800;color:var(--text)}.ack-all-confirm-dialog__desc{margin:0;font-size:13px;color:var(--muted);line-height:1.55;max-width:280px}.ack-all-confirm-dialog__actions{display:flex;gap:10px;margin-top:6px;width:100%;justify-content:center}.ack-all-confirm-dialog__actions .btn{min-width:96px;height:38px;border-radius:10px;font-size:13px;font-weight:700}.ack-all-confirm-dialog__confirm-btn{background:var(--primary);color:#fff;display:inline-flex;align-items:center;gap:6px}.ack-all-confirm-dialog__confirm-btn i{font-size:12px}.ack-all-confirm-dialog__confirm-btn:not(:disabled):hover{background:var(--primary-2)}.hero-actions{display:flex;gap:8px;align-items:center;flex-shrink:0;align-self:center}.content{width:100%}.content .tab-pane[hidden]{display:none!important}.content .tab-pane--feeding{max-width:1100px;margin:0 auto;padding:0 20px}.content .tab-pane--documents{max-width:none;padding:0}.content .tab-pane--weight{max-width:none;padding:0;background:linear-gradient(180deg,color-mix(in srgb,var(--primary, #5b6cff) 5%,var(--surface, #fff)) 0%,var(--surface, #fff) min(36vh,280px),var(--surface, #fff) 100%)}.content .tab-pane--mom{max-width:1100px;margin:0 auto;padding:0 20px calc(24px + env(safe-area-inset-bottom,0px))}.content .tab-pane--medical{max-width:none;padding:0;background:linear-gradient(180deg,color-mix(in srgb,var(--primary, #5b6cff) 7%,var(--surface, #fff)) 0%,var(--surface, #fff) min(42vh,320px),var(--surface, #fff) 100%)}.bottom-nav{--bn-primary: #5b6cff;--bn-primary-rgb: 91, 108, 255;--bn-inactive: #b0b7c3;--bn-height: 62px;position:fixed;left:0;right:0;bottom:0;width:100%;box-sizing:border-box;z-index:90;display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:var(--bn-height);padding:0 4px env(safe-area-inset-bottom,0px);background:#fffffff5;backdrop-filter:blur(24px) saturate(200%);-webkit-backdrop-filter:blur(24px) saturate(200%);border-top:1px solid rgba(0,0,0,.055);box-shadow:0 -4px 24px -4px #0f172a14}.bottom-nav .bn-side{flex:1;display:flex;align-items:center;justify-content:space-around;min-width:0}.bottom-nav .bn-fab{flex-shrink:0;width:56px;height:56px;margin-top:-20px;border-radius:999px;border:3px solid rgba(255,255,255,.96);background:var(--bn-primary);color:#fff;font-size:22px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .15s ease,background .15s ease,opacity .15s ease}.bottom-nav .bn-fab:hover:not(:disabled){background:var(--primary-2, #4c5cf0);transform:translateY(-2px)}.bottom-nav .bn-fab:active:not(:disabled){transform:translateY(0) scale(.94)}.bottom-nav .bn-fab:disabled{background:var(--bn-inactive);cursor:not-allowed;opacity:.7}.bottom-nav .bn-item{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:var(--bn-height);padding:0 2px;background:transparent;border:none;color:var(--bn-inactive);cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;transition:color .22s ease}.bottom-nav .bn-item .bn-icon-wrap{display:flex;align-items:center;justify-content:center;width:32px;height:30px;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.bottom-nav .bn-item .bn-icon{font-size:21px;line-height:1;transition:filter .22s ease;display:block}.bottom-nav .bn-item .bn-label{font-size:10px;font-weight:500;letter-spacing:.025em;line-height:1;transition:font-weight .22s ease}.bottom-nav .bn-item:not(.active):hover{color:rgba(var(--bn-primary-rgb),.7)}.bottom-nav .bn-item:active .bn-icon-wrap{transform:scale(.88)}.bottom-nav .bn-item.active{color:var(--bn-primary)}.bottom-nav .bn-item.active .bn-icon-wrap{transform:translateY(-3px) scale(1.15)}.bottom-nav .bn-item.active .bn-icon{filter:drop-shadow(0 2px 8px rgba(var(--bn-primary-rgb),.4))}.bottom-nav .bn-item.active .bn-label{font-weight:700}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:16px}.card-header{margin-bottom:16px}.card-header h2{margin:0;font-size:18px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:8px}.card-header h2 i{color:var(--primary)}.card-header p{margin:6px 0 0;color:var(--muted);font-size:13px}.eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted-2);letter-spacing:.06em}.eyebrow i{margin-right:4px}.form{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field .label{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.field .label .label-hint{font-size:11px;font-weight:500;color:var(--muted-2);font-style:italic;text-transform:none;letter-spacing:0}.field input[type=text],.field input[type=date],.field input[type=time],.field input[type=number]{padding:12px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:14px;font-family:inherit;color:var(--text);background:#fafbfc;width:100%;min-width:0;box-sizing:border-box;appearance:none;-webkit-appearance:none;transition:border-color .15s,background .15s;min-height:46px;font-variant-numeric:tabular-nums}.field input[type=text]:focus,.field input[type=date]:focus,.field input[type=time]:focus,.field input[type=number]:focus{outline:none;border-color:var(--primary);background:#fff}.field input[type=text]::placeholder,.field input[type=date]::placeholder,.field input[type=time]::placeholder,.field input[type=number]::placeholder{color:var(--muted-2)}.field input[type=number]{-moz-appearance:textfield}.field input[type=number]::-webkit-outer-spin-button,.field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.radio-group{display:flex;gap:8px;flex-wrap:wrap}.chip{padding:9px 16px;border:1.5px solid var(--border);background:#fff;border-radius:999px;font-size:13px;cursor:pointer;color:var(--text);transition:all .15s;font-family:inherit}.chip:hover{border-color:var(--primary);color:var(--primary)}.chip.active{background:var(--primary);border-color:var(--primary);color:#fff}.form-actions{display:flex;gap:10px;margin-top:4px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border:none;border-radius:10px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.small{padding:6px 12px;font-size:12px}.btn.primary{background:var(--primary);color:#fff}.btn.primary:not(:disabled):hover{background:var(--primary-2)}.btn.ghost{background:transparent;color:var(--muted);border:1.5px solid var(--border)}.btn.ghost:hover{color:var(--text);border-color:var(--border-strong)}.btn.danger-ghost{background:transparent;color:var(--rose);border:1.5px solid var(--rose-soft)}.btn.danger-ghost:hover{background:var(--rose-soft)}.btn.icon-btn{padding:0;width:36px;height:36px;justify-content:center;background:transparent;color:var(--muted);border:1.5px solid var(--border);border-radius:10px}.btn.icon-btn i{font-size:14px}.btn.icon-btn:not(:disabled):hover{color:var(--primary);border-color:var(--primary);background:var(--primary-soft)}.btn.icon-btn .spin{animation:spin-refresh .9s linear infinite}@keyframes spin-refresh{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.age-stats{display:flex;align-items:baseline;justify-content:flex-start;gap:16px;padding:14px 16px;background:var(--primary-soft);border-radius:12px}.age-stats .stat{text-align:center}.age-stats .stat .num{font-size:26px;font-weight:700;color:var(--primary);line-height:1;font-variant-numeric:tabular-nums}.age-stats .stat .unit{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-top:3px}.age-stats .dot{color:var(--muted-2);font-size:20px}.period-card{margin-bottom:0}.period-card h2{margin:6px 0 8px;font-size:20px;font-weight:700}.period-card .period-summary{color:var(--muted);font-size:14px;margin:0 0 14px;line-height:1.55}.schedule-grid{display:grid;grid-template-columns:1fr;gap:10px}.schedule{display:flex;gap:12px;padding:12px;background:#fafbfc;border:1px solid var(--border);border-radius:12px}.schedule i{color:var(--primary);font-size:18px;margin-top:2px}.schedule .schedule-title{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}.schedule .schedule-text{font-size:14px;color:var(--text);line-height:1.5}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}@media(max-width:768px){.compare-grid{grid-template-columns:1fr}}.day-card{margin-bottom:0;min-width:0;overflow:hidden}.day-card.today{border-color:#3b82f6;background:linear-gradient(180deg,#dbeafe,#fff 50%)}.day-card.yesterday{background:#fafbfc}.day-date-nav-wrap{position:relative;margin-bottom:12px}.day-date-nav-reset{position:absolute;top:-8px;right:-8px;z-index:1;width:24px;height:24px;border:1px solid var(--border);border-radius:50%;background:#fff;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:0 1px 3px #0f172a14}.day-date-nav-reset i{font-size:10px}.day-date-nav-reset:hover{background:#fee2e2;border-color:#fecaca;color:#dc2626}.day-date-nav-reset:active{background:#fee2e2;color:#dc2626}.day-date-strip{display:grid;grid-template-columns:32px 1fr 32px;gap:6px;align-items:stretch;padding:6px 8px;border-radius:10px;background:#fff;border:1px solid var(--border);touch-action:manipulation}.day-date-strip-scroller{display:flex;gap:4px;min-width:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding:1px 2px}.day-date-strip-scroller::-webkit-scrollbar{height:4px}.day-date-strip-scroller::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}.day-date-strip-day{flex:0 0 64px;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;padding:6px 4px;border:1px solid transparent;border-radius:8px;background:#f8fafc;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.day-date-strip-day:hover{background:#eef2ff;border-color:#c7d2fe}.day-date-strip-day.active{background:#dbeafe;border-color:#3b82f6;box-shadow:inset 0 0 0 1px #3b82f626}.day-date-strip-date{font-size:12px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2}.day-date-strip-ml{font-size:11px;font-weight:600;color:#1d4ed8;font-variant-numeric:tabular-nums;line-height:1.2}.day-date-strip-ml.empty{color:var(--muted);font-weight:500}.day-date-strip-arrow{width:32px;min-height:52px;flex-shrink:0;border:none;border-radius:8px;background:#f1f5f9;color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.day-date-strip-arrow i{font-size:12px}.day-date-strip-arrow:hover:not(:disabled){background:var(--primary);color:#fff}.day-date-strip-arrow:active:not(:disabled){background:var(--primary);color:#fff}.day-date-strip-arrow:disabled{opacity:.35;cursor:not-allowed}.day-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.day-head h3{margin:4px 0 0;font-size:16px;color:var(--text);font-variant-numeric:tabular-nums}.big-total{display:flex;align-items:baseline;gap:3px}.big-total .num{font-size:32px;font-weight:800;color:var(--text);line-height:1;font-variant-numeric:tabular-nums}.big-total .unit{font-size:14px;color:var(--muted);font-weight:500}.day-stats{display:flex;flex-wrap:wrap;gap:10px 16px;padding:10px 0 0;border-top:1px solid var(--border)}.day-stats>div{font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:5px}.day-stats>div i{color:var(--primary);font-size:12px}.compare-banner{margin-top:12px;padding:12px;background:var(--primary-soft);border-radius:12px;font-size:12px;color:var(--text);display:flex;flex-direction:column;gap:8px}.compare-banner strong{color:var(--primary);font-variant-numeric:tabular-nums;font-weight:700}.compare-banner .compare-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.compare-banner .compare-row:not(:last-child){padding-bottom:8px;border-bottom:1px dashed rgba(15,23,42,.1)}.compare-banner .compare-stats{display:flex;align-items:center;gap:6px;flex:1}.compare-banner .compare-stats .label{color:var(--muted);font-weight:500;font-size:11px}.compare-banner .compare-stats .count{color:var(--muted-2);font-size:11px}.compare-banner .compare-change{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;flex-shrink:0}.compare-banner .compare-change i{font-size:10px}.compare-banner .compare-change i.up{color:var(--mint)}.compare-banner .compare-change i.down{color:var(--amber)}.compare-banner .compare-change strong{font-size:12px}.compare-banner .compare-change span{color:var(--muted-2);font-weight:500}.today-logs{margin-top:12px;padding:12px;background:#fafbfc;border:1px solid var(--border);border-radius:12px}.logs-header{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}.logs-header span{display:flex;align-items:center;gap:6px}.logs-header span:before{content:\"\\1f37c\";font-size:14px}.logs-header .logs-more{text-transform:none;letter-spacing:0;background:transparent;border:none;color:var(--primary);font-size:12px;font-weight:600;padding:4px 8px;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;gap:3px;transition:background .2s ease}.logs-header .logs-more i{font-size:10px}.logs-header .logs-more:hover{background:var(--primary-soft)}.log-list{display:flex;flex-direction:column;gap:6px;min-width:0}.log-row{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#fafbfc;border-radius:8px;font-size:13px;min-width:0;max-width:100%;transition:all .2s ease;position:relative}.log-row.low-volume .log-volume{color:#f59e0b;font-weight:900}.log-row.high-volume .log-volume{color:#10b981;font-weight:900}.log-row:hover{background:#f1f5f9;transform:translateY(-1px);box-shadow:0 2px 8px #0000000d}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.log-time{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;min-width:42px}.log-volume{font-weight:800;color:var(--primary);font-size:16px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.log-gap{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;background:#f3f4f6;color:#6b7280;border-radius:999px;font-size:10.5px;font-weight:600;white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums;transition:all .2s ease}.log-gap i{font-size:9px;opacity:.7}.log-gap.feed-gap-warn{background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-weight:700;border:1px solid rgba(234,88,12,.45);box-shadow:0 0 0 1px #fff3 inset,0 2px 8px #ea580c59}.log-gap.feed-gap-warn i{opacity:.95;color:inherit}.log-note{color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.log-actions{margin-left:auto;display:inline-flex;align-items:center;gap:2px}.log-edit,.log-del{background:transparent;border:none;color:var(--muted-2);cursor:pointer;padding:4px 6px;border-radius:6px;font-size:12px;transition:all .2s ease}.log-edit:hover{color:var(--primary);background:var(--primary-soft)}.log-del:hover{color:var(--rose);background:var(--rose-soft)}.empty-mini{padding:12px;text-align:center;color:var(--muted-2);font-size:13px;font-style:italic}.countdown-hero{display:flex;flex-direction:column;gap:16px;padding:18px 20px;background:#fff;border-radius:16px;border:1px solid #e6e9ff;transition:all .3s ease;margin-bottom:20px}.countdown-hero .hero-main{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:20px}.countdown-hero .feeding-time-card{flex:1;min-width:0;text-align:center}.countdown-hero .feeding-time-card .time-header{margin-bottom:12px;display:flex;justify-content:center}.countdown-hero .feeding-time-card .time-header .status-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:6px 12px;border-radius:14px;white-space:nowrap}.countdown-hero .feeding-time-card .time-header .status-badge i{font-size:11px}.countdown-hero .feeding-time-card .time-header .status-badge.status-waiting{background:var(--primary-soft);color:var(--primary)}.countdown-hero .feeding-time-card .time-header .status-badge.status-now{background:#fee2e2;color:#dc2626;animation:pulse-gentle 2s ease-in-out infinite;font-size:11px;text-transform:none;font-weight:700}.countdown-hero .feeding-time-card .time-header .status-badge.status-late{background:var(--rose-soft);color:var(--rose)}.countdown-hero .feeding-time-card .time-display .predicted-time{font-size:42px;font-weight:800;line-height:1;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin-bottom:4px}.countdown-hero .feeding-time-card .time-display .time-remaining{font-size:15px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}.countdown-hero .countdown-next{display:flex;flex-direction:column;gap:8px;padding-left:16px;border-left:1px dashed #d8dcff;flex-shrink:0;min-width:0}.countdown-hero .next-item{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.countdown-hero .next-item i{color:var(--primary);font-size:13px}.countdown-hero .next-item strong{font-weight:700}.countdown-hero .next-item .predict-label,.countdown-hero .next-item .recommend-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);margin-left:4px}.countdown-hero .next-item .recommend-label{color:var(--mint)}.countdown-hero .volume-info{display:flex;flex-direction:column;gap:8px;padding-left:20px;border-left:1px dashed #d8dcff;flex-shrink:0;min-width:160px;transition:all .3s ease}.countdown-hero .volume-info .volume-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.countdown-hero .volume-info .volume-row .volume-prefix{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);flex-shrink:0}.countdown-hero .volume-info .volume-row .volume-amount{font-size:22px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1;text-align:right}.countdown-hero .volume-info .volume-row.predicted-row .volume-prefix,.countdown-hero .volume-info .volume-row.predicted-row .volume-amount{color:var(--primary)}.countdown-hero .volume-info .volume-row.recommended-row .volume-prefix,.countdown-hero .volume-info .volume-row.recommended-row .volume-amount{color:var(--mint)}.countdown-hero[data-status=waiting]{border-color:#bbf7d0;background:linear-gradient(135deg,#f7fef8,#f0fdf4)}.countdown-hero[data-status=waiting] .feeding-time-card .time-display .predicted-time{color:#16a34a}.countdown-hero[data-status=waiting] .feeding-time-card .time-display .time-remaining{color:#15803d}.countdown-hero[data-status=waiting] .feeding-time-card .status-badge.status-waiting{background:#dcfce7!important;color:#15803d!important;border:1px solid #86efac}.countdown-hero[data-status=waiting] .volume-info .volume-amount{color:#16a34a}.countdown-hero[data-status=waiting] .volume-info .volume-prefix{color:#15803d}.countdown-hero[data-status=late]{border-color:#fca5a5;background:linear-gradient(135deg,#fef2f2,#fee2e2)}.countdown-hero[data-status=late] .feeding-time-card .time-display .predicted-time{color:#dc2626}.countdown-hero[data-status=late] .feeding-time-card .time-display .time-remaining{color:#b91c1c}.countdown-hero[data-status=late] .feeding-time-card .status-badge.status-late{background:#fee2e2;color:#dc2626;border:1px solid #fca5a5}.countdown-hero[data-status=late] .volume-info .volume-amount{color:#dc2626}.countdown-hero[data-status=late] .volume-info .volume-prefix{color:#b91c1c}.countdown-hero[data-status=now]{border-color:#fbbf24;background:linear-gradient(135deg,#fefce8,#fef3c7);animation:pulse-card 2s ease-in-out infinite}.countdown-hero[data-status=now] .feeding-time-card .time-display .predicted-time{color:#92400e}.countdown-hero[data-status=now] .feeding-time-card .time-display .time-remaining{color:#a16207}.countdown-hero[data-status=now] .feeding-time-card .status-badge.status-now{background:#fef3c7!important;color:#b45309!important;border:1px solid #f59e0b!important}.countdown-hero[data-status=now] .volume-info .volume-amount{color:#92400e}.countdown-hero[data-status=now] .volume-info .volume-prefix{color:#a16207}@media(max-width:540px){.countdown-hero .hero-main{flex-direction:column;align-items:stretch;gap:12px}.countdown-hero .hero-main .volume-info{border-left:none;border-top:1px dashed #d8dcff;padding-left:0;padding-top:12px;min-width:auto}.countdown-hero .hero-main .volume-info .volume-row{justify-content:space-between;padding:0 4px}.countdown-hero .hero-main .feeding-time-card .time-display .predicted-time{font-size:36px}.countdown-hero .hero-main .feeding-time-card .volume-info .volume-amount{font-size:20px}}@media(max-width:400px){.countdown-hero .feeding-time-card .status-badge{font-size:10px;padding:4px 10px}.countdown-hero .feeding-time-card .time-display .predicted-time{font-size:32px}.countdown-hero .volume-info .volume-amount{font-size:18px}}@keyframes pulse-soft{0%,to{opacity:1}50%{opacity:.65}}@keyframes pulse-gentle{0%,to{opacity:1}50%{opacity:.75}}@keyframes pulse-urgent{0%,to{opacity:1;text-shadow:0 0 0 rgba(239,68,68,0)}50%{opacity:.8;text-shadow:0 0 8px rgba(239,68,68,.25)}}@keyframes pulse-card{0%,to{transform:scale(1);box-shadow:0 1px 3px #0000001a,0 0 #f8717100}50%{transform:scale(1.02);box-shadow:0 4px 12px #00000026,0 0 0 2px #f871714d}}.burp-warning{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;margin:0 0 16px;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #f59e0b;border-radius:14px;box-shadow:0 2px 8px #f59e0b33;animation:burp-pulse 2s ease-in-out infinite}.burp-warning__icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#f59e0b;border-radius:50%;color:#fff;font-size:18px;animation:burp-icon-bounce 1.5s ease-in-out infinite}.burp-warning__content{flex:1;min-width:0}.burp-warning__title{font-size:15px;font-weight:700;color:#92400e;margin-bottom:4px}.burp-warning__text{font-size:13px;color:#78350f;line-height:1.5;margin-bottom:8px}.burp-warning__text strong{font-weight:600;color:#92400e}.burp-warning__countdown{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#ffffffb3;border-radius:8px;font-size:13px;color:#92400e;font-weight:500}.burp-warning__countdown i{font-size:14px;color:#f59e0b}.burp-warning__countdown strong{font-size:16px;font-weight:700;color:#d97706}@keyframes burp-pulse{0%,to{box-shadow:0 2px 8px #f59e0b33}50%{box-shadow:0 4px 16px #f59e0b59}}@keyframes burp-icon-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.countdown-progress{margin-top:10px}.countdown-progress .cp-track{position:relative;height:6px;background:#ffffffbf;border-radius:999px;overflow:hidden}.countdown-progress .cp-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:999px;transition:width .4s ease}.countdown-progress .cp-fill[data-status=waiting]{background:linear-gradient(90deg,#22c55e,#16a34a)}.countdown-progress .cp-fill[data-status=late]{background:linear-gradient(90deg,#f87171,#dc2626)}.countdown-progress .cp-fill[data-status=now]{background:linear-gradient(90deg,#fbbf24,#d97706)}.countdown-progress .cp-labels{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;font-size:11.5px;color:var(--muted)}.countdown-progress .cp-labels i{font-size:10px;margin-right:2px;color:var(--muted-2)}.countdown-progress .cp-labels .muted{color:var(--muted-2)}.countdown-progress .cp-labels .cp-right{font-weight:600;color:var(--muted);white-space:nowrap}.predict-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:12px;margin-bottom:16px}.predict-head .eyebrow{color:var(--primary);display:flex;align-items:center;gap:4px}.predict-head .eyebrow.sparkle i{animation:sparkle 2s ease-in-out infinite}.predict-head h2{margin:4px 0 0;font-size:20px;font-weight:700}.last-feed{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;border-radius:12px;margin-bottom:14px;border:1px solid #e8e9ff}.last-feed .last-feed-icon{width:38px;height:38px;border-radius:50%;background:var(--primary-soft);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.last-feed .last-feed-icon i{color:var(--primary);font-size:16px}.last-feed .last-feed-body{flex:1;min-width:0}.last-feed .last-feed-label{font-size:10px;font-weight:700;text-transform:uppercase;color:var(--muted-2);letter-spacing:.06em;margin-bottom:2px}.last-feed .last-feed-value{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.last-feed .last-feed-value strong{color:var(--primary);font-size:18px;font-weight:800}.last-feed .last-feed-value .sep{color:var(--muted-2)}.last-feed .last-feed-value .ago{color:var(--accent);font-weight:600;font-size:13px}.last-feed .last-feed-note{margin-top:4px;font-size:12px;color:var(--muted);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.predict-empty{padding:14px 16px;background:#fff;border-radius:12px;color:var(--muted);font-size:13px;display:flex;align-items:center;gap:8px}.predict-empty i{color:var(--primary)}.predict-body{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}@media(max-width:640px){.predict-body{grid-template-columns:1fr}}.predict-metric{background:#fff;border-radius:12px;padding:14px;text-align:center}.predict-metric .metric-label{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;display:flex;align-items:center;justify-content:center;gap:5px}.predict-metric .metric-label i{color:var(--primary);font-size:12px}.predict-metric .metric-value{font-size:28px;font-weight:800;line-height:1;color:var(--primary);font-variant-numeric:tabular-nums}.predict-metric .metric-value .ml-unit{font-size:14px;color:var(--muted);font-weight:500;margin-left:2px}.predict-metric .metric-sub{margin-top:6px;font-size:12px;color:var(--muted)}.reasoning{background:#fff;border-radius:12px;padding:12px 14px;margin-bottom:12px}.reasoning .reasoning-head{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted);letter-spacing:.05em;margin-bottom:6px}.reasoning .reasoning-head i{color:var(--primary);margin-right:4px}.reasoning ul{margin:0;padding-left:18px;list-style:disc}.reasoning li{font-size:13px;color:var(--text);line-height:1.55;margin:2px 0}.predict-actions{display:flex;justify-content:flex-end}.feed-list-card{margin-bottom:16px}.feed-list-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.feed-list-head h2{margin:4px 0 0;font-size:18px;font-weight:700}.feed-list-compact{display:flex;flex-direction:column;gap:6px}.feed-row{display:grid;grid-template-columns:68px 80px 1fr auto;gap:10px;align-items:center;padding:10px 12px;transition:all .2s ease;position:relative}.feed-row.low-volume .feed-row-volume strong{color:#f59e0b;font-weight:900}.feed-row.high-volume .feed-row-volume strong{color:#10b981;font-weight:900}.feed-row{background:#fafbfc;border-radius:10px;border:1px solid var(--border)}.feed-row .feed-row-time{display:flex;flex-direction:column;line-height:1.2;font-variant-numeric:tabular-nums;gap:3px}.feed-row .feed-row-time .time{font-weight:700;color:var(--text);font-size:14px}.feed-row .feed-row-time .date{font-size:11px;color:var(--muted-2)}.feed-row .feed-row-time .feed-row-gap{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:600;color:#6b7280;background:#f3f4f6;padding:1px 6px;border-radius:999px;width:fit-content;white-space:nowrap;font-variant-numeric:tabular-nums}.feed-row .feed-row-time .feed-row-gap i{font-size:8px;opacity:.7}.feed-row .feed-row-time .feed-row-gap.feed-gap-warn{background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-weight:700;border:1px solid rgba(234,88,12,.45);box-shadow:0 0 0 1px #fff3 inset,0 2px 8px #ea580c59}.feed-row .feed-row-time .feed-row-gap.feed-gap-warn i{opacity:.95;color:inherit}.feed-row .feed-row-volume{font-variant-numeric:tabular-nums}.feed-row .feed-row-volume strong{color:var(--primary);font-size:19px;font-weight:800;letter-spacing:-.01em}.feed-row .feed-row-volume .u{font-size:11px;color:var(--muted);margin-left:2px}.feed-row .feed-row-note{font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.feed-row .feed-row-note.muted{color:var(--muted-2);font-style:italic}.feed-row .feed-row-actions{display:inline-flex;align-items:center;gap:2px;margin-left:auto}.feed-row .feed-row-edit,.feed-row .feed-row-del{background:transparent;border:none;color:var(--muted-2);cursor:pointer;padding:6px 8px;border-radius:6px;font-size:13px}.feed-row .feed-row-edit:hover{color:var(--primary, #5b6cff);background:#5b6cff1a}.feed-row .feed-row-del:hover{color:var(--rose);background:var(--rose-soft)}@media(max-width:480px){.feed-row{grid-template-columns:58px 70px 1fr auto;gap:8px;padding:8px 10px}.feed-row .feed-row-time .time{font-size:13px}}.dialog-wide{max-width:720px;display:flex;flex-direction:column;padding:0;overflow:hidden}@media(max-width:640px){.dialog-wide{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 72px);border-radius:14px}}.dialog-wide .dialog-head{position:sticky;top:0;z-index:5;background:var(--surface);padding:16px 20px;margin:0;border-bottom:1px solid var(--border);-webkit-backdrop-filter:saturate(1.2) blur(6px);backdrop-filter:saturate(1.2) blur(6px)}@media(max-width:640px){.dialog-wide .dialog-head{padding:12px 14px}}.dialog-wide .dialog-close{width:40px;height:40px;font-size:16px;background:#f1f3f7;color:var(--text)}.dialog-wide .dialog-close:hover{background:var(--rose-soft);color:var(--rose)}.dialog-wide .history-body,.dialog-wide .tips-dialog-body{padding:18px 20px 24px;overflow-y:auto;flex:1;min-height:0}@media(max-width:640px){.dialog-wide .history-body,.dialog-wide .tips-dialog-body{padding:14px 14px 20px}}.history-body{display:flex;flex-direction:column;gap:18px}.history-paging-hint{margin:0;font-size:12px;line-height:1.45}.history-load-more{display:grid;justify-items:center;width:100%;box-sizing:border-box;padding:8px 0 12px}.history-load-more .btn{width:auto;max-width:min(320px,100%);min-width:0;margin-inline:auto;justify-content:center}.tips-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;background:#f1f3f7;border-radius:12px;margin-bottom:16px}.nav-arrow{width:40px;height:40px;border-radius:50%;border:none;background:#fff;color:var(--primary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:16px;transition:all .15s;flex-shrink:0}.nav-arrow:hover:not(:disabled){background:var(--primary);color:#fff;transform:scale(1.05)}.nav-arrow:active:not(:disabled){transform:scale(.95)}.nav-arrow:disabled{opacity:.35;cursor:not-allowed}.tips-now-btn{flex:1;padding:9px 16px;border:none;background:transparent;border-radius:999px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:all .15s}.tips-now-btn i{font-size:12px}.tips-now-btn:hover{color:var(--primary);background:#fff}.tips-now-btn.active{background:var(--primary);color:#fff;pointer-events:none}.tips-dialog-body .period-summary{font-size:14px;color:var(--muted);line-height:1.6;margin:0 0 14px}.tips-dialog-body .schedule-grid{grid-template-columns:repeat(2,1fr);margin-bottom:16px}@media(max-width:560px){.tips-dialog-body .schedule-grid{grid-template-columns:1fr}}.dialog-tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.history-group .history-group-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--primary-soft);border-radius:10px;margin-bottom:8px}.history-group .history-group-head .h-date{font-size:14px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.history-group .history-group-head .h-day{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.history-group .history-group-head .h-total{font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.history-group .history-group-head .h-total strong{color:var(--primary);font-size:20px;font-weight:800}.history-group .history-group-head .h-total .h-count{color:var(--muted);font-size:12px;font-weight:500;margin-left:4px}.history-group .history-group-head .h-total .h-avg{color:var(--primary);font-size:12px;font-weight:600;margin-left:4px;font-variant-numeric:tabular-nums}.history-group .history-group-rows{display:flex;flex-direction:column;gap:4px}.tips-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:4px 4px 0}.tips-section-head .eyebrow i{margin-right:4px}.tips-section-head h2{margin:4px 0 0;font-size:20px;font-weight:700;color:var(--text)}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.filter-chip{padding:7px 14px;border:1.5px solid var(--border);background:#fff;border-radius:999px;font-size:13px;font-weight:500;cursor:pointer;color:var(--muted);display:inline-flex;align-items:center;gap:5px;transition:all .15s;font-family:inherit}.filter-chip i{font-size:12px}.filter-chip:hover{border-color:var(--cat-color, var(--primary));color:var(--cat-color, var(--primary))}.filter-chip.active{background:var(--cat-color, var(--primary));border-color:var(--cat-color, var(--primary));color:#fff}.tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:20px}.tip-card{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--cat-color, var(--primary));border-radius:12px;padding:16px;transition:transform .15s}.tip-card:hover{transform:translateY(-2px)}.tip-card .tip-head{margin-bottom:8px}.tip-card .tip-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;background:var(--cat-color, var(--primary));color:#fff;font-size:11px;font-weight:600;border-radius:999px;text-transform:uppercase;letter-spacing:.04em}.tip-card .tip-pill i{font-size:10px}.tip-card .tip-title{margin:6px 0 8px;font-size:15px;font-weight:700;line-height:1.35;color:var(--text)}.tip-card .tip-body{margin:0;font-size:13px;line-height:1.55;color:var(--muted)}.empty{grid-column:1/-1;padding:40px 20px;text-align:center;color:var(--muted-2)}.empty i{font-size:32px;margin-bottom:8px;display:block}.upcoming{margin-bottom:24px}.upcoming h3{margin:0 0 12px;font-size:16px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px}.upcoming h3 i{color:var(--primary)}.upcoming-grid{display:flex;gap:8px;flex-wrap:wrap}.upcoming-item{padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:10px;font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}.upcoming-item i{color:var(--primary);font-size:12px}.disclaimer{padding:16px;background:var(--amber-soft);border-radius:12px;color:#78350f;font-size:13px;line-height:1.5;margin-bottom:24px;display:flex;gap:8px;align-items:flex-start}.disclaimer i{color:var(--amber);margin-top:2px}.toast{position:fixed;bottom:100px;left:50%;transform:translate(-50%);z-index:90;padding:12px 18px;border-radius:12px;font-size:14px;font-weight:500;box-shadow:0 6px 24px #0f172a1f;display:flex;align-items:center;gap:8px;animation:toastIn .3s cubic-bezier(.4,0,.2,1)}.toast.success{background:var(--mint);color:#fff}.toast.error{background:var(--rose);color:#fff}@keyframes toastIn{0%{transform:translate(-50%,20px);opacity:0}to{transform:translate(-50%);opacity:1}}.fab{position:fixed;bottom:calc(80px + env(safe-area-inset-bottom,0px));right:20px;z-index:96;display:inline-flex;align-items:center;gap:10px;padding:14px 22px 14px 18px;background:var(--primary);color:#fff;border:none;border-radius:999px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:0 8px 24px #5b6cff73;transition:transform .15s,box-shadow .15s,background .15s}.fab i{font-size:18px;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#ffffff2e}.fab .fab-label{white-space:nowrap}.fab:hover{background:var(--primary-2);transform:translateY(-2px);box-shadow:0 12px 28px #5b6cff8c}.fab:active{transform:translateY(0)}@media(max-width:480px){.fab{padding:14px}.fab .fab-label{display:none}.fab i{font-size:22px;width:28px;height:28px}}.dialog-overlay{position:fixed;inset:0;background:#0f172a8c;z-index:110;display:flex;align-items:center;justify-content:center;padding:20px;animation:overlayIn .2s ease-out}.dialog-overlay.dialog-overlay--front{z-index:400}.dialog-overlay.dialog-overlay--event-reminder{z-index:410}@media(max-width:640px){.dialog-overlay{padding:calc(env(safe-area-inset-top,0px) + 16px) 12px calc(env(safe-area-inset-bottom,0px) + 16px);align-items:flex-start}}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}.dialog{background:var(--surface);border-radius:20px;width:100%;max-width:560px;max-height:min(100vh - 40px,100dvh - 40px);overflow-y:auto;padding:24px;animation:dialogIn .25s cubic-bezier(.4,0,.2,1);box-shadow:0 20px 60px #0f172a40}@media(max-width:640px){.dialog{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 32px);border-radius:16px}}@keyframes dialogIn{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}.dialog-head h2{margin:4px 0 0;font-size:20px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}.dialog-head h2 i{color:var(--primary)}.dialog-close{background:#f1f3f7;border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;color:var(--muted);font-size:14px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,color .15s}.dialog-close:hover{background:var(--rose-soft);color:var(--rose)}.log-form{display:flex;flex-direction:column;gap:14px}.log-volume-field{margin:0}.log-volume-field .log-volume-input-row{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 10px;min-width:0}.log-volume-field .log-volume-input-row>input[type=number]{flex:0 0 118px;width:118px;max-width:min(118px,100%);min-width:0}.log-volume-field .predict-hint--inline{flex:1 1 auto;min-width:0;margin:0;padding:6px 10px;gap:6px;font-size:12px;border-radius:8px}.log-volume-field .predict-hint--inline>i{font-size:13px;flex-shrink:0}.log-volume-field .predict-hint--inline .hint-text{flex:1 1 auto;min-width:0;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.log-volume-field .predict-hint--inline .btn.small{flex-shrink:0;padding:4px 8px;font-size:11px}@media(max-width:400px){.log-volume-field .log-volume-input-row>input[type=number]{flex:1 1 100px;width:100%;max-width:none}.log-volume-field .predict-hint--inline{flex:1 1 100%;white-space:normal}.log-volume-field .predict-hint--inline .hint-text{white-space:normal;overflow:visible;text-overflow:unset}}.edit-date-banner{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 14px;background:linear-gradient(135deg,#eef2ff,#f5f3ff);border:1px solid #dbe1ff;border-radius:12px;font-size:13px;color:var(--text)}.edit-date-banner>i.pi-calendar{color:var(--primary, #5b6cff);font-size:15px}.edit-date-banner .edb-label{color:var(--muted, #6b7280);font-weight:500}.edit-date-banner .edb-value{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.edit-date-banner .edb-lock{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex-shrink:0;border-radius:50%;background:#ffffffe0;border:1px solid #e2e8f0;color:var(--muted, #64748b)}.edit-date-banner .edb-lock i{font-size:14px;line-height:1}.log-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.log-grid .field.full{grid-column:1/-1}.log-grid.log-grid--date-time{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:560px){.log-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:380px){.log-grid{grid-template-columns:1fr}}.quick-volumes{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.quick-volumes .quick-label{font-size:12px;color:var(--muted);font-weight:600;margin-right:4px}.quick-chip{padding:7px 13px;background:#f1f3f7;border:none;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer;color:var(--muted);transition:all .15s;font-family:inherit}.quick-chip:hover{background:var(--primary-soft);color:var(--primary)}.quick-chip.now-chip{background:var(--primary-soft);color:var(--primary);display:inline-flex;align-items:center;gap:4px}.quick-chip.now-chip:hover{background:var(--primary);color:#fff}.quick-chip.formula-chip{display:inline-flex;align-items:center;gap:5px;background:#fff7ed;color:#c2410c;border:1px solid #fed7aa}.quick-chip.formula-chip i{font-size:11px;opacity:.9}.quick-chip.formula-chip:hover{background:#ffedd5;color:#9a3412;border-color:#fdba74}.quick-chip.formula-chip.active{background:#c2410c;color:#fff;border-color:#c2410c;box-shadow:0 2px 8px #c2410c40}.quick-chip.formula-chip.active:hover{background:#9a3412;border-color:#9a3412;color:#fff}.bottle-prep{background:#f0f9ff;border:1px solid #bae6fd;border-radius:12px;padding:8px 12px;margin-bottom:16px;display:flex;flex-direction:column;gap:8px;transition:background .2s,border-color .2s}.bottle-prep:has(.bp-warning){background:#fffbeb;border-color:#fde68a}.bottle-prep:has(.bp-warning) .bp-info>i{color:#f59e0b}.bottle-prep:has(.bp-warning) .bp-info strong{color:#d97706}.bottle-prep:has(.bp-warning) .bp-prep-user{color:#92400e;background:#fbbf246b}.bottle-prep:has(.bp-warning) .bp-prep-time{color:#c2410c;background:linear-gradient(180deg,#fff7ed,#ffedd5);border-color:#fb923c73}.bottle-prep:has(.bp-form){align-items:stretch;padding:10px 12px 12px}.bottle-prep .bp-warning{display:flex;align-items:center;justify-content:space-between;gap:10px;animation:slideDown .2s ease;flex-wrap:wrap}.bottle-prep .bp-warning__content{display:flex;align-items:center;gap:8px;font-size:13px;flex:1;min-width:0}.bottle-prep .bp-warning__content i{font-size:16px;flex-shrink:0}.bottle-prep .bp-warning__content strong{font-weight:700}.bottle-prep .bp-warning--expired{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:8px 10px;color:#991b1b}.bottle-prep .bp-warning--expired i{color:#dc2626}.bottle-prep .bp-warning--soon{background:#fefce8;border:1px solid #fde68a;border-radius:8px;padding:8px 10px;color:#92400e}.bottle-prep .bp-warning--soon i{color:#f59e0b}.bottle-prep .bp-warning__btn{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;padding:7px 12px;font-size:12px;font-weight:700;font-family:inherit;color:#fff;background:linear-gradient(180deg,#f59e0b,#d97706);border:none;border-radius:8px;cursor:pointer;box-shadow:0 2px 4px #f59e0b40;transition:all .15s ease}.bottle-prep .bp-warning__btn i{font-size:12px}.bottle-prep .bp-warning__btn:hover{background:linear-gradient(180deg,#fbbf24,#f59e0b);transform:translateY(-1px);box-shadow:0 4px 8px #f59e0b59}.bottle-prep .bp-warning__btn:active{transform:translateY(0)}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.bottle-prep .bp-info-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.bottle-prep:not(:has(.bp-warning)):not(:has(.bp-form)){flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}.bottle-prep .bp-info{display:flex;align-items:flex-start;gap:8px;font-size:14px;color:var(--text);flex:1;min-width:0}.bottle-prep .bp-info>i{color:#0ea5e9;font-size:16px;margin-top:2px;flex-shrink:0}.bottle-prep .bp-info .bp-text{line-height:1.45;min-width:0}.bottle-prep .bp-info .bp-useby{display:inline-block;margin-top:2px;font-size:13px}.bottle-prep .bp-info strong{color:#0284c7;font-weight:800;font-variant-numeric:tabular-nums}.bottle-prep .bp-info .muted{color:var(--muted);font-size:13px}.bottle-prep .bp-actions{display:flex;gap:4px}.bottle-prep .bp-add{flex:1;background:transparent;border:none;padding:6px 4px;font-size:13px;font-weight:600;color:#0284c7;cursor:pointer;display:flex;align-items:center;gap:8px;font-family:inherit;text-align:left}.bottle-prep .bp-add>i{font-size:15px}.bottle-prep .bp-add:hover{color:#0369a1}.bottle-prep .bp-form{display:flex;flex-direction:column;gap:8px;width:100%}.bottle-prep .bp-form-head{display:flex;align-items:center;gap:6px}.bottle-prep .bp-form-head>i{color:#0ea5e9;font-size:15px}.bottle-prep .bp-form-head .bp-label{font-size:13px;color:var(--muted);font-weight:600;white-space:nowrap}.bottle-prep .bp-input-wrap{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #7dd3fc;border-radius:10px;padding:3px;transition:border-color .15s,box-shadow .15s}.bottle-prep .bp-input-wrap:focus-within{border-color:#0ea5e9;box-shadow:0 0 0 3px #0ea5e926}.bottle-prep .bp-input-wrap .bp-step{width:30px;height:30px;flex-shrink:0;border-radius:8px;border:none;background:#e0f2fe;color:#0369a1;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-family:inherit;transition:all .12s}.bottle-prep .bp-input-wrap .bp-step:hover{background:#bae6fd;color:#0284c7}.bottle-prep .bp-input-wrap .bp-step:active{transform:scale(.94)}.bottle-prep .bp-input-wrap .bp-step:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.bottle-prep .bp-input-wrap .bp-input{flex:1;min-width:60px;padding:4px 6px;font-size:18px;font-weight:800;border:none;background:transparent;font-variant-numeric:tabular-nums;font-family:inherit;color:#d97706;text-align:center;letter-spacing:-.01em}.bottle-prep .bp-input-wrap .bp-input:focus{outline:none}.bottle-prep .bp-input-wrap .bp-input:disabled{opacity:.55;cursor:not-allowed}.bottle-prep .bp-input-wrap .bp-unit{font-size:12px;color:var(--muted);font-weight:600;padding-right:4px}.bottle-prep .bp-quick{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.bottle-prep .bp-quick .bp-quick-label{font-size:11px;color:var(--muted);font-weight:600;margin-right:2px}.bottle-prep .bp-quick .bp-quick-chip{padding:4px 9px;background:#f0f9ff;border:1px solid #7dd3fc;border-radius:999px;font-size:11.5px;font-weight:700;color:#0369a1;cursor:pointer;font-family:inherit;font-variant-numeric:tabular-nums;transition:all .12s}.bottle-prep .bp-quick .bp-quick-chip:hover{background:#e0f2fe;border-color:#38bdf8;color:#0284c7}.bottle-prep .bp-quick .bp-quick-chip:active{transform:scale(.95)}.bottle-prep .bp-quick .bp-quick-chip:disabled{opacity:.45;cursor:not-allowed}.bottle-prep .bp-form-actions{display:flex;gap:6px;justify-content:flex-end}.bottle-prep .bp-btn{width:32px;height:32px;border-radius:8px;border:none;background:#fff;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:12px;transition:all .15s;flex-shrink:0}.bottle-prep .bp-btn:hover:not(:disabled){background:#e0f2fe;color:#0284c7}.bottle-prep .bp-btn:disabled{opacity:.45;cursor:not-allowed}.bottle-prep .bp-btn.primary{background:#0ea5e9;color:#fff}.bottle-prep .bp-btn.primary:hover:not(:disabled){background:#0284c7}.bottle-prep .bp-btn.danger:hover{background:var(--rose-soft);color:var(--rose)}.calc-block{border:1px solid #fde7c2;background:#fffaf0;border-radius:12px;overflow:hidden}.calc-block .calc-head{padding:10px 14px 0}.calc-block .prep-info{display:flex;align-items:flex-start;gap:6px;font-size:13px;color:var(--text)}.calc-block .prep-info>i{color:#f59e0b;font-size:14px;margin-top:2px;flex-shrink:0}.calc-block .prep-info .prep-info-text{line-height:1.45;min-width:0}.calc-block .prep-info strong{color:#d97706;font-weight:800;font-variant-numeric:tabular-nums}.calc-block .prep-info .muted{color:var(--muted-2);font-size:12px;display:inline-block;margin-top:2px}.calc-block .calc-body{padding:8px 14px 14px;display:flex;flex-direction:column;gap:10px}.calc-block .field.mini.remaining-input{position:relative;margin:0;display:flex;flex-direction:column}.calc-block .field.mini.remaining-input .label{font-size:11px;font-weight:600;color:var(--muted);margin-bottom:4px}.calc-block .field.mini.remaining-input input{width:100%;padding:10px 36px 10px 12px;font-size:16px;font-weight:700;border:1px solid #fadf9e;border-radius:8px;background:#fff;font-variant-numeric:tabular-nums;font-family:inherit;color:#d97706}.calc-block .field.mini.remaining-input input:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b26}.calc-block .field.mini.remaining-input .suffix{position:absolute;right:12px;top:50%;transform:translateY(4px);font-size:12px;color:var(--muted-2);pointer-events:none}.calc-block .calc-result-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.calc-block .calc-result{display:flex;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums}.calc-block .calc-result .calc-label{font-size:13px;color:var(--muted);font-weight:600}.calc-block .calc-result strong{font-size:22px;font-weight:800;color:var(--primary)}.calc-block .calc-result .u{font-size:12px;color:var(--primary);margin-left:2px}.calc-block .calc-result .muted{color:var(--muted-2);font-size:18px}.calc-block .calc-apply{flex-shrink:0}.calc-block .calc-apply:disabled{background:#e5e7eb;color:var(--muted-2);cursor:not-allowed;box-shadow:none}.predict-hint{display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(135deg,var(--primary-soft) 0%,var(--accent-soft) 100%);border-radius:10px;font-size:13px}.predict-hint>i{color:var(--primary);font-size:16px}.predict-hint .hint-text{flex:1;color:var(--text)}.predict-hint .hint-text strong{color:var(--primary);font-weight:700}.predict-hint.predict-hint--inline .hint-text strong{font-weight:800;font-variant-numeric:tabular-nums}.sync-error{padding:10px 14px;background:var(--rose-soft);color:#991b1b;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:6px}.sync-success{padding:10px 14px;background:var(--mint-soft);color:#166534;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:6px;animation:fadeIn .2s ease}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}.feeding-settings-dialog .feeding-settings-hint{margin:0 0 14px;font-size:13px;line-height:1.45}.feeding-settings-dialog .feeding-settings-hint code{font-size:11px;padding:1px 5px;border-radius:4px;background:#f1f5f9}.feeding-settings-dialog .feeding-settings-grid{grid-template-columns:1fr;gap:16px}.feeding-settings-dialog .field-hint{display:block;margin-top:8px;font-size:12px;line-height:1.4;padding:8px 12px;background:#f8fafc;border-radius:8px;border-left:3px solid #e2e8f0}.feeding-settings-dialog .label{position:relative}.feeding-settings-dialog .label code{font-size:11px;font-weight:600;color:var(--primary);background:var(--primary-soft);padding:2px 6px;border-radius:4px}.feeding-settings-dialog .label .notification-badge{display:inline-flex;align-items:center;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff;background:linear-gradient(135deg,#10b981,#059669);padding:2px 6px;border-radius:10px;margin-left:6px;box-shadow:0 1px 2px #10b98133;animation:gentle-pulse 2s ease-in-out infinite}.feeding-settings-dialog .notification-setting-field{position:relative}.feeding-settings-dialog .notification-setting-field input{border:1.5px solid #10b981;background:linear-gradient(to right,#fff,#f0fdf4)}.feeding-settings-dialog .notification-setting-field input:focus{border-color:#059669;box-shadow:0 0 0 3px #10b9811a;background:#fff}.feeding-settings-dialog .notification-setting-field input::placeholder{color:#6b7280;opacity:.7}.feeding-settings-dialog .notification-setting-field .field-hint{border-left-color:#10b981;background:linear-gradient(to right,#f0fdf4,#f8fafc)}@keyframes gentle-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.02)}}.log-time--with-badge,.feed-row-time .time--with-badge{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}.log-merge-badge,.feed-merge-badge{font:inherit;font-size:10px;font-weight:700;padding:2px 7px;border-radius:999px;border:1px solid rgba(99,102,241,.35);background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#312e81;cursor:pointer;line-height:1.2;white-space:nowrap}.log-merge-badge:hover,.feed-merge-badge:hover{filter:brightness(1.03)}.log-row--clickable,.feed-row--clickable{cursor:pointer}.log-row--clickable:hover,.feed-row--clickable:hover{background:#6366f10f}.log-row--clickable:focus-visible,.feed-row--clickable:focus-visible{outline:2px solid rgba(99,102,241,.45);outline-offset:2px}.dialog-overlay.dialog-overlay--front.feed-group-detail-overlay{z-index:125}.dialog-overlay.dialog-overlay--front.feed-detail-overlay{z-index:140;animation:overlayIn .12s ease-out}.dialog-overlay.dialog-overlay--front.feed-detail-overlay .feed-detail-dialog{animation:feedDetailIn .14s ease-out}@keyframes feedDetailIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.feed-detail-dialog{--fd-accent: 99, 102, 241;--fd-soft: #eef2ff;--fd-strong: #4338ca;max-width:min(400px,96vw);padding:0;overflow:hidden;display:flex;flex-direction:column}.feed-detail-dialog[data-status=low]{--fd-accent: 245, 158, 11;--fd-soft: #fffbeb;--fd-strong: #b45309}.feed-detail-dialog[data-status=high]{--fd-accent: 244, 63, 94;--fd-soft: #fff1f2;--fd-strong: #e11d48}.feed-detail-dialog[data-status=ok]{--fd-accent: 16, 185, 129;--fd-soft: #ecfdf5;--fd-strong: #059669}.feed-detail-top{position:relative;padding:20px 20px 16px;text-align:center;background:radial-gradient(120% 80% at 50% -20%,rgba(var(--fd-accent),.22),transparent 55%),linear-gradient(180deg,var(--fd-soft) 0%,#ffffff 72%);border-bottom:1px solid rgba(var(--fd-accent),.12)}.feed-detail-close{position:absolute;top:12px;right:12px;width:36px;height:36px;border:none;border-radius:50%;background:#ffffffd9;color:#64748b;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px #0f172a14;transition:background .15s ease,color .15s ease}.feed-detail-close:hover{background:#fff;color:#0f172a}.feed-detail-eyebrow{margin:0 0 6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b}.feed-detail-metric{display:flex;align-items:flex-end;justify-content:center;gap:4px;line-height:1;margin-bottom:10px}.feed-detail-metric__value{font-size:clamp(48px,14vw,56px);font-weight:800;letter-spacing:-.04em;color:var(--fd-strong);font-variant-numeric:tabular-nums}.feed-detail-metric__unit{font-size:18px;font-weight:700;color:rgba(var(--fd-accent),.85);padding-bottom:8px}.feed-detail-status{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700;background:#fff;border:1px solid rgba(var(--fd-accent),.28);color:var(--fd-strong);box-shadow:0 2px 6px rgba(var(--fd-accent),.1)}.feed-detail-status .pi{font-size:13px}.feed-detail-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px}.feed-detail-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:12px;background:#ffffffeb;border:1px solid #e2e8f0;font-size:12px;font-weight:600;color:#334155;line-height:1.3;box-shadow:0 1px 4px #0f172a0a}.feed-detail-chip .pi{font-size:13px;color:#6366f1;flex-shrink:0}.feed-detail-chip em{font-style:normal;font-weight:500;color:#94a3b8;margin-left:4px}.feed-detail-chip--time .pi{color:#dc2626}.feed-detail-chip--time span{font-variant-numeric:tabular-nums;font-weight:700;color:#dc2626}.feed-detail-chip--muted{background:#f8fafc;border-color:#e2e8f0;color:#64748b;font-weight:500}.feed-detail-chip--muted .pi{color:#94a3b8}.feed-detail-body{padding:16px 18px 8px;overflow-y:auto;flex:1;min-height:0}.feed-detail-section{margin-bottom:14px}.feed-detail-section:last-child{margin-bottom:0}.feed-detail-section__title{margin:0 0 10px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;display:flex;align-items:center;gap:7px}.feed-detail-section__title .pi{font-size:13px;color:#6366f1}.feed-detail-cards{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.feed-detail-card{display:flex;align-items:flex-start;gap:12px;padding:12px 13px;border-radius:14px;background:linear-gradient(180deg,#fafbff,#fff);border:1px solid #e2e8f0;box-shadow:0 2px 8px #0f172a0a}.feed-detail-card--warn,.feed-detail-card--gap.feed-detail-card--warn{border-color:#f59e0b66;background:linear-gradient(180deg,#fffbeb,#fff)}.feed-detail-card--warn .feed-detail-card__icon,.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__icon{background:#fef3c7;color:#b45309}.feed-detail-card--warn .feed-detail-card__text,.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__text{color:#92400e}.feed-detail-card--position{border-color:#8b5cf659;background:linear-gradient(180deg,#f5f3ff,#fff)}.feed-detail-card--average{border-color:#0ea5e959;background:linear-gradient(180deg,#f0f9ff,#fff)}.feed-detail-card--next{border-color:#10b98159;background:linear-gradient(180deg,#ecfdf5,#fff)}.feed-detail-card--gap:not(.feed-detail-card--warn){border-color:#64748b59;background:linear-gradient(180deg,#f8fafc,#fff)}.feed-detail-card__icon{flex-shrink:0;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#eef2ff;color:#4f46e5;font-size:15px}.feed-detail-card__icon[data-kind=position]{background:#ede9fe;color:#7c3aed}.feed-detail-card__icon[data-kind=average]{background:#e0f2fe;color:#0284c7}.feed-detail-card__icon[data-kind=next]{background:#d1fae5;color:#059669}.feed-detail-card__icon[data-kind=gap]{background:#e2e8f0;color:#475569}.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__icon{background:#fef3c7;color:#b45309}.feed-detail-card__body{min-width:0;flex:1}.feed-detail-card__label{display:block;font-size:11px;font-weight:800;color:#64748b;margin-bottom:3px;letter-spacing:.02em}.feed-detail-card__text{margin:0;font-size:13px;line-height:1.5;color:#0f172a}.fdc-position__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin-bottom:8px}.fdc-position__idx{font-size:18px;font-weight:800;color:#6d28d9;letter-spacing:-.02em}.fdc-position__of{font-size:14px;font-weight:700;color:#a78bfa}.fdc-position__tag{font-size:11px;font-weight:600;color:#64748b;padding:2px 8px;border-radius:999px;background:#8b5cf61a}.fdc-progress{height:8px;border-radius:999px;background:#ede9fe;overflow:hidden;margin-bottom:10px}.fdc-progress__fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#8b5cf6,#6366f1);transition:width .2s ease}.fdc-position__stats{display:flex;flex-wrap:wrap;gap:8px}.fdc-stat{display:inline-flex;align-items:baseline;gap:4px;padding:6px 10px;border-radius:10px;font-size:12px}.fdc-stat strong{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}.fdc-stat small{font-size:11px;font-weight:600;opacity:.85}.fdc-stat--violet{background:#f5f3ff;color:#5b21b6}.fdc-stat--violet strong{color:#6d28d9}.fdc-stat--indigo{background:#eef2ff;color:#4338ca}.fdc-stat--indigo strong{color:#4f46e5}.fdc-avg,.fdc-next{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}.fdc-pill{display:inline-flex;padding:4px 10px;border-radius:999px;font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}.fdc-pill--up{background:#dcfce7;color:#15803d}.fdc-pill--down{background:#fee2e2;color:#b91c1c}.fdc-pill--neutral{background:#f1f5f9;color:#475569}.fdc-avg__meta{font-size:12px;color:#64748b;line-height:1.4}.fdc-avg__meta strong{color:#0f172a;font-weight:700}.fdc-next__time{font-size:16px;font-weight:800;color:#dc2626;font-variant-numeric:tabular-nums}.fdc-next__vol{font-size:14px;font-weight:800;color:#059669;padding:4px 10px;border-radius:8px;background:#d1fae5}.fdc-next__gap{font-size:12px;font-weight:600;color:#64748b;display:inline-flex;align-items:center;gap:4px}.fdc-gap{display:flex;flex-direction:column;gap:10px}.fdc-gap__prev{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;padding:10px 12px;border-radius:10px;background:#ffffffe6;border:1px solid #e2e8f0}.fdc-gap__prev-label{font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;width:100%}.fdc-gap__prev-time{font-size:17px;font-weight:800;color:#0f172a;font-variant-numeric:tabular-nums}.fdc-gap__prev-vol{font-size:14px;font-weight:800;color:#475569;padding:3px 8px;border-radius:8px;background:#f1f5f9}.fdc-gap__prev-date{font-size:11px;font-weight:600;color:#94a3b8}.fdc-gap__row{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;min-width:0}.fdc-gap__interval{display:inline-flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;color:#475569;background:#e2e8f0;white-space:nowrap}.fdc-gap__interval .pi{font-size:13px;flex-shrink:0}.fdc-gap__interval span{overflow:hidden;text-overflow:ellipsis}.fdc-gap__interval--warn{color:#b45309;background:#fde68a;border:1px solid rgba(245,158,11,.35)}.fdc-gap__vol-diff{flex:0 0 auto;white-space:nowrap;font-size:12px;padding:5px 10px}.feed-detail-quote{margin:0;padding:12px 14px 12px 16px;border-radius:0;border-left:3px solid #c7d2fe;background:#f8fafc;font-size:14px;line-height:1.55;color:#334155;font-style:normal}.feed-detail-footer{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid #e2e8f0;background:#fafbff}.feed-detail-cta{display:flex;gap:8px;justify-content:stretch}.feed-detail-cta .btn{flex:1;justify-content:center}.feed-detail-cta .btn.primary{flex:1.2}.feed-group-detail-dialog .feed-group-detail-summary{margin:0 0 8px;padding:0 2px;font-size:13px;line-height:1.45}.feed-group-detail-dialog .feed-group-detail-hint{margin:0 0 12px;font-size:12px;line-height:1.4;display:flex;align-items:center;gap:6px}.feed-group-detail-dialog .feed-group-detail-history{margin-bottom:4px}.feed-group-detail-dialog .feed-group-detail-rows{max-height:min(58vh,420px);overflow-y:auto;padding-right:2px}.mom-food-card{--mf-tone: 244, 114, 182;--mf-soft: #fdf2f8;--mf-ring: #fbcfe8;--mf-strong: #db2777;position:relative;overflow:hidden;background:radial-gradient(900px 260px at 0% 0%,rgba(var(--mf-tone),.14),transparent 60%),#fff;border-color:rgba(var(--mf-tone),.22);padding:18px;margin-top:16px}.mom-food-card[data-accent=rose]{--mf-tone: 244, 63, 94;--mf-soft: #fff1f2;--mf-ring: #fecdd3;--mf-strong: #e11d48}.mom-food-card[data-accent=peach]{--mf-tone: 251, 146, 60;--mf-soft: #fff7ed;--mf-ring: #fed7aa;--mf-strong: #ea580c}.mom-food-card[data-accent=mint]{--mf-tone: 16, 185, 129;--mf-soft: #ecfdf5;--mf-ring: #a7f3d0;--mf-strong: #059669}.mom-food-card[data-accent=lavender]{--mf-tone: 139, 92, 246;--mf-soft: #f5f3ff;--mf-ring: #ddd6fe;--mf-strong: #7c3aed}.mom-food-card[data-accent=amber]{--mf-tone: 245, 158, 11;--mf-soft: #fffbeb;--mf-ring: #fde68a;--mf-strong: #d97706}.mf-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.mf-head__lead{min-width:0;flex:1}.mf-head .eyebrow{display:inline-flex;align-items:center;gap:6px;color:var(--mf-strong);font-weight:700}.mf-head .eyebrow i{font-size:13px}.mf-head h2{margin:4px 0 0;font-size:18px;font-weight:800;color:var(--text);line-height:1.25}.mf-headline{margin:4px 0 0;font-size:13px;color:var(--mf-strong);font-weight:600}.mf-nav{display:inline-flex;align-items:center;gap:6px;background:var(--mf-soft);border-radius:999px;padding:4px;border:1px solid rgba(var(--mf-tone),.25);flex-shrink:0}.mf-arrow{width:30px;height:30px;border-radius:50%;border:none;background:#fff;color:var(--mf-strong);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease,background .15s ease}.mf-arrow i{font-size:12px}.mf-arrow:hover:not(:disabled){transform:scale(1.08);background:var(--mf-strong);color:#fff}.mf-arrow:disabled{opacity:.35;cursor:not-allowed}.mf-step{font-variant-numeric:tabular-nums;font-size:12px;color:var(--muted);padding:0 4px}.mf-step strong{color:var(--mf-strong);font-weight:800;font-size:13px}.mf-reset{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--mf-strong);background:transparent;border:1px dashed rgba(var(--mf-tone),.5);border-radius:999px;padding:4px 12px;cursor:pointer;margin-bottom:10px;transition:background .15s ease}.mf-reset:hover{background:var(--mf-soft)}.mf-reset i{font-size:11px}.mf-desc{margin:0 0 14px;font-size:13px;color:var(--muted);line-height:1.55}.mf-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}@media(max-width:640px){.mf-columns{grid-template-columns:1fr}}.mf-col{padding:12px 14px;border-radius:14px;background:#fff;border:1px solid #eef0f3}.mf-col--good{background:linear-gradient(180deg,#f0fdf4,#fff 80%);border-color:#bbf7d0}.mf-col--bad{background:linear-gradient(180deg,#fef2f2,#fff 80%);border-color:#fecaca}.mf-col-title{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:14px;font-weight:800;color:var(--text);letter-spacing:.01em}.mf-dot{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;flex-shrink:0;font-size:11px}.mf-dot i{font-size:10px}.mf-dot.good{background:#10b981;box-shadow:0 2px 6px #10b9814d}.mf-dot.bad{background:#ef4444;box-shadow:0 2px 6px #ef44444d}.mf-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.mf-item{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:10px;background:#ffffffb3;transition:background .15s ease,transform .15s ease}.mf-item:hover{background:#fff;transform:translate(2px)}.mf-item--bad .mf-name{color:#7f1d1d}.mf-item--good .mf-name{color:#064e3b}.mf-emoji{width:28px;height:28px;border-radius:8px;background:#fff;display:inline-grid;place-items:center;font-size:16px;flex-shrink:0;box-shadow:0 1px 2px #0f172a0f}.mf-emoji--x{background:#fef2f2;color:#ef4444}.mf-emoji--x i{font-size:12px}.mf-item-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.mf-name{font-size:13px;font-weight:700;color:var(--text);line-height:1.3}.mf-note{font-size:11.5px;color:var(--muted);line-height:1.35}.mf-tip{display:flex;align-items:flex-start;gap:8px;padding:10px 14px;border-radius:12px;background:var(--mf-soft);border:1px solid rgba(var(--mf-tone),.22);font-size:12.5px;color:var(--text);line-height:1.5}.mf-tip i{color:var(--mf-strong);font-size:15px;margin-top:1px;flex-shrink:0}.mom-tab .card{padding:12px 14px;margin-bottom:10px;border-radius:14px}.mom-tab .mom-wellness-section,.mom-tab .mom-tips-week{margin-bottom:10px}.mom-tab .mom-food-card{padding:12px 14px;margin-top:10px}.mom-tab .mf-head{margin-bottom:8px}.mom-tab .mf-head h2{font-size:16px}.mom-tab .mf-desc{margin-bottom:10px;font-size:12px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.mom-tab .mf-columns{gap:8px;margin-bottom:8px}.mom-tab .mf-col{padding:8px 10px}.mom-tab .mf-list{gap:6px}.mom-tab .mf-item{padding:6px 8px}.mom-tab .mf-tip{padding:8px 10px;font-size:12px}.mom-hero{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;margin-bottom:14px;background:linear-gradient(135deg,#fdf2f8,#faf5ff,#eef2ff);border:1px solid #f9a8d4;border-radius:16px}.mom-hero .mom-hero__icon{font-size:36px;line-height:1;flex-shrink:0}.mom-hero h2{margin:0 0 6px;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.02em}.mom-hero .mom-hero__sub{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}.mom-hero .mom-hero__sub strong{color:var(--text)}.mom-hero .mom-hero__sub .muted-inline{display:block;margin-top:4px;font-size:12.5px;opacity:.92}.mom-hero--compact{align-items:center;padding:10px 12px;margin-bottom:10px;border-radius:14px;gap:10px}.mom-hero--compact .mom-hero__icon{font-size:26px}.mom-hero--compact h2{margin:0;font-size:16px;letter-spacing:-.01em}.mom-hero--compact .mom-hero__title-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px}.mom-hero--compact .mom-hero__baby{font-size:12px;font-weight:700;color:#be185d;padding:2px 8px;border-radius:999px;background:#ffffffbf;border:1px solid rgba(244,114,182,.35)}.mom-hero--compact .mom-hero__sub{margin:4px 0 0;font-size:11.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mom-hero--compact .mom-hero__sub .muted-inline{display:inline;margin-top:0;font-size:11.5px}.section-head--tight{margin-bottom:8px}.section-head--tight h3{margin:0}.mom-disclaimer--compact{font-size:11px;line-height:1.4;padding:8px 10px;margin-top:4px;margin-bottom:6px}.section-head{margin-bottom:14px}.section-head h3{margin:0 0 6px;font-size:16px;font-weight:800;display:flex;align-items:center;gap:8px;color:var(--text)}.section-head h3 i{color:#db2777;font-size:15px}.section-head .section-sub{margin:0;font-size:12.5px;color:var(--muted);line-height:1.45}.mom-wellness-section{margin-bottom:16px}.mom-tab .mom-wellness-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}.mom-wellness-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.mom-w-card{padding:14px 14px 12px;border-radius:14px;border:1px solid var(--border);background:#fafafa;transition:border-color .15s,box-shadow .15s}.mom-w-card:hover{border-color:#f472b6;box-shadow:0 6px 18px -12px #db277759}.mom-w-card .mom-w-card__icon{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#fce7f3,#ede9fe);display:flex;align-items:center;justify-content:center;margin-bottom:10px}.mom-w-card .mom-w-card__icon i{font-size:16px;color:#be185d}.mom-w-card h4{margin:0 0 8px;font-size:13.5px;font-weight:800;color:var(--text);line-height:1.3}.mom-w-card p{margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}.mom-tips-week{margin-bottom:16px}.mom-tab .mom-tips-list{gap:6px}.mom-tab .mom-tips-list li{padding:8px 10px;border-radius:10px}.mom-tab .mom-tips-list li strong{margin-bottom:2px;font-size:12px}.mom-tab .mom-tips-list li span{font-size:11.5px;line-height:1.4}.mom-tips-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.mom-tips-list li{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:#fefce8;border:1px solid #fde047}.mom-tips-list li>i{color:#ca8a04;margin-top:2px;flex-shrink:0}.mom-tips-list li strong{display:block;font-size:13px;font-weight:800;color:var(--text);margin-bottom:4px}.mom-tips-list li span{font-size:12.5px;line-height:1.5;color:var(--muted)}.mom-disclaimer{margin-top:8px;margin-bottom:8px}.mom-empty-profile{max-width:520px;margin:24px auto 40px;text-align:center}.mom-empty-profile__inner{padding:28px 22px}.mom-empty-profile__inner .mom-empty-emoji{font-size:48px;display:block;margin-bottom:12px}.mom-empty-profile__inner h2{margin:0 0 10px;font-size:17px;font-weight:800;color:var(--text)}.mom-empty-profile__inner p{margin:0 0 18px;font-size:14px;line-height:1.55;color:var(--muted)}.event-reminder-dialog{max-width:min(520px,100vw - 28px);padding-bottom:8px}.event-reminder-dialog__head{align-items:flex-start;margin-bottom:4px}.event-reminder-dialog__title{margin:0;padding-right:40px;font-size:20px;font-weight:800;line-height:1.3;color:var(--text, #0f172a);display:flex;align-items:center;gap:10px;letter-spacing:-.02em}.event-reminder-dialog__title .pi-bell{color:#f59e0b;font-size:18px;flex-shrink:0}.event-reminder-list{list-style:none;margin:12px 0 0;padding:0;max-height:min(52vh,400px);overflow:auto;display:flex;flex-direction:column;gap:10px}.event-reminder-card{padding:14px 16px;background:linear-gradient(180deg,#fafbff,#fff);border:1px solid #e2e8f0;border-radius:14px;box-shadow:0 2px 8px #0f172a0d}.event-reminder-card__title{margin:0;font-size:16px;font-weight:800;color:var(--text, #0f172a);line-height:1.35}.event-reminder-card__datetime{margin:5px 0 0;font-size:12.5px;font-weight:500;color:#64748b;line-height:1.4}.event-reminder-card__date{color:#475569;font-weight:600}.event-reminder-card__sep{color:#94a3b8}.event-reminder-card__hour{color:#dc2626;font-weight:700;font-variant-numeric:tabular-nums}.event-reminder-card__place{margin:6px 0 0;display:flex;align-items:flex-start;gap:6px;font-size:13px;color:#475569;line-height:1.4}.event-reminder-card__place .pi-map-marker{margin-top:2px;flex-shrink:0;font-size:13px;color:var(--primary, #5b6cff)}.event-reminder-card__content-wrap{margin-top:10px;padding-top:10px;border-top:1px solid #eef1f6}.event-reminder-card__content-label{display:block;margin-bottom:4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8}.event-reminder-card__content{margin:0;font-size:13.5px;color:#334155;line-height:1.5;white-space:pre-wrap}.event-reminder-actions{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border, #e5e7eb)}.event-reminder-actions__link{flex:0 1 auto;min-width:0;padding:6px 4px;border:none;background:transparent;color:#64748b;font-size:13px;font-weight:600;font-family:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.event-reminder-actions__link:hover:not(:disabled){color:#334155}.event-reminder-actions__link:disabled{opacity:.5;cursor:not-allowed}.event-reminder-actions__primary{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;font-size:15px;font-weight:700;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DocumentsComponent, selector: "app-documents" }, { kind: "component", type: MedicalHistoryComponent, selector: "app-medical-history", inputs: ["user"], outputs: ["openExplorerFile"] }, { kind: "component", type: WeightComponent, selector: "app-weight", inputs: ["user", "birthDate", "gender", "babyName"] }, { kind: "component", type: ActivityLogComponent, selector: "app-activity-log", outputs: ["activityChanged"] }, { kind: "component", type: FeedingScheduleComponent, selector: "app-feeding-schedule", inputs: ["user"] }, { kind: "component", type: FeedingMomComponent, selector: "app-feeding-mom", inputs: ["profile", "editing"], outputs: ["goToFeeding"] }, { kind: "component", type: FeedingChartsComponent, selector: "app-feeding-charts", inputs: ["logs", "now", "nutritionTarget"] }, { kind: "component", type: FeedingNutritionComponent, selector: "app-feeding-nutrition", inputs: ["nutritionTarget", "todayStats", "now", "latestWeightKg", "editing"], outputs: ["goToWeight"] }, { kind: "component", type: FeedingProfileComponent, selector: "app-feeding-profile", inputs: ["user", "profile", "draft", "editing", "maxBirthDate"], outputs: ["save", "cancelEdit", "startEdit", "clearProfile", "draftNameChange", "draftBirthChange", "draftGenderChange"] }, { kind: "component", type: FeedingDialogsComponent, selector: "app-feeding-dialogs", inputs: ["logs", "user", "now", "bottlePrep", "feedingSettings", "prediction", "todayStats", "yesterdayStats", "todayLogs", "yesterdayLogs", "maxBirthDate", "syncError", "syncMessage"], outputs: ["logsChanged", "settingsChanged", "syncErrorChange", "syncMessageChange", "logDialogOpenChange", "bottlePrepClearRequested"] }, { kind: "component", type: FeedingDailyComponent, selector: "app-feeding-daily", inputs: ["logs", "feedingSettings", "now", "nutritionTarget", "user", "syncMessage", "syncError", "logDialogOpen", "loadingLogs", "refreshToken"], outputs: ["logsChanged", "bottlePrepChange", "editLog", "historyOpen", "feedRowClick"] }, { kind: "component", type: HeroHeaderComponent, selector: "app-hero-header", inputs: ["profile", "age", "user", "weightLabel", "isAnyLoading", "showRefresh"], outputs: ["refresh", "openMenu"] }, { kind: "component", type: HeroStatsStripComponent, selector: "app-hero-stats-strip", inputs: ["currentTime", "dateLabel", "nextFeedTime", "nextFeedCountdown", "weightLabel", "whoStatus"] }, { kind: "component", type: NotificationBannerComponent, selector: "app-notification-banner", inputs: ["notifications", "saving", "currentUser", "dialogOpen"], outputs: ["openDialog", "closeDialog", "acknowledge", "acknowledgeAll", "delete", "openComposer"] }, { kind: "component", type: NotificationListComponent, selector: "app-notification-list", inputs: ["notifications", "currentUser", "saving"], outputs: ["back", "acknowledge", "acknowledgeAll", "delete", "openComposer"] }, { kind: "component", type: SubrouteShellComponent, selector: "app-subroute-shell", inputs: ["title"], outputs: ["back"] }, { kind: "component", type: SettingsMenuComponent, selector: "app-settings-menu", inputs: ["appName", "appVersion", "showDocuments", "unreadCount"], outputs: ["close", "select"] }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1$1.SlicePipe, name: "slice" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
15561
15825
|
}
|
|
15562
15826
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: FeedingComponent, decorators: [{
|
|
15563
15827
|
type: Component,
|
|
@@ -15577,7 +15841,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
|
|
|
15577
15841
|
HeroHeaderComponent,
|
|
15578
15842
|
HeroStatsStripComponent,
|
|
15579
15843
|
NotificationBannerComponent,
|
|
15580
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"feeding-root\">\n <div class=\"feeding-page\" #feedingPage>\n <div class=\"backdrop\"></div>\n\n <header class=\"hero\" [class.hero--profile-merged]=\"profile() && !editing() && ageBreakdown()\">\n @if (profile() && !editing() && ageBreakdown(); as age) {\n <!-- \u2550\u2550 REDESIGNED HERO \u2550\u2550 -->\n <app-hero-header\n [profile]=\"profile()!\"\n [age]=\"age\"\n [user]=\"user()\"\n [weightLabel]=\"profileHeroWeightLabel()\"\n [isAnyLoading]=\"isAnyLoading()\"\n [showRefresh]=\"bottomTab() !== 'schedule'\"\n (editProfile)=\"startEdit()\"\n (deleteProfile)=\"clearProfile()\"\n (openSettings)=\"feedingDialogs.openFeedingSettingsDialog()\"\n (openAbout)=\"openAboutDialog()\"\n (refresh)=\"refreshAll()\"\n >\n <app-activity-log slot=\"activity-log\" (activityChanged)=\"onActivityChanged()\"></app-activity-log>\n </app-hero-header>\n\n <app-hero-stats-strip\n [currentTime]=\"currentTimeStr\"\n [dateLabel]=\"heroDateLabel\"\n [nextFeedTime]=\"prediction()?.nextTime ?? null\"\n [nextFeedCountdown]=\"heroNextFeedCountdown()\"\n [weightLabel]=\"profileHeroWeightLabel()\"\n [whoStatus]=\"nutritionTarget()?.ageLabel ?? null\"\n ></app-hero-stats-strip>\n\n <div class=\"hero-notif-wrap\">\n <app-notification-banner\n [notifications]=\"visibleNotifications()\"\n [saving]=\"notificationSaving()\"\n [currentUser]=\"user()\"\n [dialogOpen]=\"notifDialogOpen()\"\n (openDialog)=\"notifDialogOpen.set(true)\"\n (closeDialog)=\"notifDialogOpen.set(false)\"\n (acknowledge)=\"acknowledgeNotification($event)\"\n (acknowledgeAll)=\"notifDialogOpen.set(false); openAcknowledgeAllConfirmDialog()\"\n (delete)=\"deleteNotification($event)\"\n (openComposer)=\"notifDialogOpen.set(false); openNotificationComposerDialog()\"\n ></app-notification-banner>\n </div>\n\n } @else {\n <!-- \u2500\u2500 Fallback: no profile / editing \u2500\u2500 -->\n <div class=\"hero-inner\">\n <div class=\"hero-brand\">\n <div class=\"hero-title-row\">\n <div class=\"hero-title\">\n <div class=\"emoji\" aria-hidden=\"true\">\uD83D\uDC76</div>\n <div class=\"hero-text\">\n <h1>B\u00E9 y\u00EAu c\u1EE7a b\u1EA1n</h1>\n <p class=\"hero-userline\">\n <i class=\"pi pi-user\" aria-hidden=\"true\"></i>\n <strong>{{ user() }}</strong>\n </p>\n </div>\n </div>\n @if (profile() && !editing()) {\n <div class=\"hero-actions\">\n <app-activity-log (activityChanged)=\"onActivityChanged()\"></app-activity-log>\n <button\n class=\"btn icon-btn\"\n type=\"button\"\n (click)=\"feedingDialogs.openFeedingSettingsDialog()\"\n title=\"C\u00E0i \u0111\u1EB7t\"\n aria-label=\"C\u00E0i \u0111\u1EB7t c\u1EEF b\u00FA\"\n >\n <i class=\"pi pi-sliders-h\"></i>\n </button>\n @if (bottomTab() !== 'schedule') {\n <button\n class=\"btn icon-btn\"\n type=\"button\"\n (click)=\"refreshAll()\"\n [disabled]=\"isAnyLoading()\"\n [title]=\"\n isAnyLoading() ? '\u0110ang t\u1EA3i\u2026' : 'T\u1EA3i l\u1EA1i C\u1EEF b\u00FA, C\u00E2n, L\u1ECBch, Y t\u1EBF, T\u00E0i li\u1EC7u'\n \"\n aria-label=\"T\u1EA3i l\u1EA1i C\u1EEF b\u00FA, Th\u1EC3 tr\u1EA1ng, L\u1ECBch, Ti\u1EC1n s\u1EED y t\u1EBF v\u00E0 T\u00E0i li\u1EC7u\"\n >\n <i class=\"pi pi-refresh\" [class.spin]=\"isAnyLoading()\"></i>\n </button>\n }\n </div>\n }\n </div>\n </div>\n\n <div class=\"hero-datetime\" aria-live=\"polite\">\n <div class=\"hero-datetime-strip\">\n <div class=\"hero-datetime-strip__block hero-datetime-strip__block--date\">\n <i class=\"pi pi-calendar\" aria-hidden=\"true\"></i>\n <span class=\"hero-datetime-strip__wd\">{{ heroWeekday }}</span>\n <time class=\"hero-datetime-strip__date\" [attr.datetime]=\"todayDateStr()\">{{\n heroDateNumeric\n }}</time>\n </div>\n <span class=\"hero-datetime-strip__divider\" aria-hidden=\"true\"></span>\n <div class=\"hero-datetime-strip__block hero-datetime-strip__block--time\">\n <i class=\"pi pi-clock\" aria-hidden=\"true\"></i>\n <span class=\"hero-datetime-strip__clock\">{{ currentTimeStr }}</span>\n </div>\n </div>\n </div>\n\n <section class=\"hero-notification\" aria-label=\"Th\u00F4ng b\u00E1o n\u1ED9i b\u1ED9\">\n <!-- watermark background icons -->\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-bell\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-megaphone\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-comments\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--send\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-send\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--star\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-star\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--bolt\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-bolt\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--heart\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-heart\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--info\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-info-circle\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--check\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-check-circle\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--eye\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-eye\"></i>\n </span>\n\n <div class=\"hero-notification__head\">\n <label class=\"hero-notification__composer-label\" for=\"hero-notification-input\">\n <i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i>\n <span>Th\u00F4ng b\u00E1o</span>\n @if (visibleNotifications().length > 0) {\n <span class=\"hero-notification__unread-badge\">{{\n visibleNotifications().length\n }}</span>\n }\n </label>\n <div class=\"hero-notification__head-actions\">\n <button\n type=\"button\"\n class=\"hero-notification__mark-all\"\n (click)=\"openAcknowledgeAllConfirmDialog()\"\n [disabled]=\"notificationSaving() || visibleNotifications().length === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n \u0110\u00E3 \u0111\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button\n type=\"button\"\n class=\"hero-notification__add\"\n (click)=\"openNotificationComposerDialog()\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n title=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n\n @if (displayedNotifications().length > 0) {\n <ul class=\"hero-notification__list\">\n @for (notice of displayedNotifications(); track notice) {\n <li class=\"hero-notification__item\">\n <div class=\"hero-notification__avatar\" aria-hidden=\"true\">\n {{ notice.user | slice: 0 : 2 | uppercase }}\n </div>\n <div class=\"hero-notification__body\">\n <div class=\"hero-notification__body-head\">\n <span class=\"hero-notification__author\">{{ notice.user }}</span>\n </div>\n <p class=\"hero-notification__content\">{{ notice.content }}</p>\n @if (notice.createdAt) {\n <span class=\"hero-notification__created\">{{\n formatNotificationCreatedAt(notice.createdAt)\n }}</span>\n }\n </div>\n <div class=\"hero-notification__item-actions\">\n <button\n type=\"button\"\n class=\"hero-notification__ack-top\"\n (click)=\"acknowledgeNotification(notice)\"\n [disabled]=\"notificationSaving()\"\n aria-label=\"\u0110\u00E3 \u0111\u1ECDc th\u00F4ng b\u00E1o\"\n title=\"\u0110\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDeleteNotification(notice)) {\n <button\n type=\"button\"\n class=\"hero-notification__delete\"\n (click)=\"deleteNotification(notice)\"\n [disabled]=\"notificationSaving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\"\n title=\"X\u00F3a th\u00F4ng b\u00E1o\"\n >\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </li>\n }\n </ul>\n } @else {\n <div class=\"hero-notification__empty\">\n <i class=\"pi pi-bell hero-notification__empty-icon\" aria-hidden=\"true\"></i>\n <span class=\"hero-notification__empty-title\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n <span class=\"hero-notification__empty-sub\"\n >M\u1ECDi th\u1EE9 \u0111\u1EC1u \u1ED5n. Th\u00F4ng b\u00E1o m\u1EDBi s\u1EBD xu\u1EA5t hi\u1EC7n \u1EDF \u0111\u00E2y.</span\n >\n </div>\n }\n\n @if (hiddenNotificationCount() > 0) {\n <button\n type=\"button\"\n class=\"hero-notification__more\"\n (click)=\"openNotificationListDialog()\"\n >\n Xem th\u00EAm {{ hiddenNotificationCount() }} th\u00F4ng b\u00E1o \u2192\n </button>\n }\n </section>\n\n </div>\n } <!-- end @else no-profile -->\n </header>\n\n <!-- \u2550\u2550 NOTIFICATION DIALOGS \u2014 rendered outside <header> to avoid overflow/stacking-context clipping \u2550\u2550 -->\n @if (notificationComposerDialogOpen()) {\n <div\n class=\"dialog-overlay dialog-overlay--front\"\n (click)=\"closeNotificationComposerDialog()\"\n >\n <div\n class=\"dialog hero-notification-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n (click)=\"$event.stopPropagation()\"\n >\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\" aria-hidden=\"true\"><i class=\"pi pi-bell\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\" aria-hidden=\"true\"><i class=\"pi pi-megaphone\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--send\" aria-hidden=\"true\"><i class=\"pi pi-send\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--star\" aria-hidden=\"true\"><i class=\"pi pi-star\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\" aria-hidden=\"true\"><i class=\"pi pi-comments\"></i></span>\n\n <div class=\"dialog-head hero-notification-dialog__head\">\n <div class=\"hero-notification-dialog__title-group\">\n <div class=\"hero-notification-dialog__icon-wrap\">\n <i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i>\n </div>\n <div>\n <h2 class=\"hero-notification-dialog__title\">T\u1EA1o th\u00F4ng b\u00E1o</h2>\n <p class=\"hero-notification-dialog__subtitle\">Th\u00F4ng b\u00E1o s\u1EBD hi\u1EC3n th\u1ECB cho to\u00E0n b\u1ED9 th\u00E0nh vi\u00EAn</p>\n </div>\n </div>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeNotificationComposerDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <div class=\"hero-notification__composer-panel\">\n <div class=\"hero-notification__composer-row\">\n <div class=\"hero-notification__input-wrap\">\n <textarea\n id=\"hero-notification-input\"\n class=\"hero-notification__input\"\n [value]=\"notificationDraft()\"\n (input)=\"updateNotificationDraft($any($event.target).value)\"\n [disabled]=\"notificationSaving()\"\n maxlength=\"300\"\n placeholder=\"Nh\u1EADp n\u1ED9i dung th\u00F4ng b\u00E1o cho m\u1ECDi ng\u01B0\u1EDDi...\"\n aria-label=\"N\u1ED9i dung th\u00F4ng b\u00E1o\"\n ></textarea>\n <div class=\"hero-notification__char-ring\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 36 36\">\n <circle class=\"hero-notification__char-ring-track\" cx=\"18\" cy=\"18\" r=\"15\" />\n <circle class=\"hero-notification__char-ring-fill\" cx=\"18\" cy=\"18\" r=\"15\"\n [style.stroke-dashoffset]=\"94 - (notificationDraft().trim().length / 300) * 94\" />\n </svg>\n <span class=\"hero-notification__char-count\">{{ notificationDraft().trim().length }}</span>\n </div>\n </div>\n </div>\n <div class=\"hero-notification__composer-actions\">\n <button type=\"button\" class=\"btn ghost hero-notification__cancel\"\n (click)=\"closeNotificationComposerDialog()\" [disabled]=\"notificationSaving()\">H\u1EE7y</button>\n <button type=\"button\" class=\"btn hero-notification__send\"\n (click)=\"createNotification()\"\n [disabled]=\"notificationSaving() || !notificationDraft().trim()\">\n <i class=\"pi pi-send\"></i>\n <span>G\u1EEDi th\u00F4ng b\u00E1o</span>\n </button>\n </div>\n </div>\n @if (notificationError()) {\n <p class=\"hero-notification__error\">{{ notificationError() }}</p>\n }\n </div>\n </div>\n }\n\n @if (notificationListDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeNotificationListDialog()\">\n <div class=\"dialog hero-notification-list-dialog\" role=\"dialog\" aria-modal=\"true\"\n aria-label=\"Danh s\u00E1ch th\u00F4ng b\u00E1o\" (click)=\"$event.stopPropagation()\">\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\" aria-hidden=\"true\"><i class=\"pi pi-bell\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\" aria-hidden=\"true\"><i class=\"pi pi-megaphone\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\" aria-hidden=\"true\"><i class=\"pi pi-comments\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--star\" aria-hidden=\"true\"><i class=\"pi pi-star\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--check\" aria-hidden=\"true\"><i class=\"pi pi-check-circle\"></i></span>\n\n <div class=\"dialog-head hero-notification-list-dialog__head\">\n <div class=\"hero-notification-dialog__title-group\">\n <div class=\"hero-notification-dialog__icon-wrap\"><i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i></div>\n <div>\n <h2 class=\"hero-notification-list-dialog__title\">To\u00E0n b\u1ED9 th\u00F4ng b\u00E1o</h2>\n <p class=\"hero-notification-dialog__subtitle\">{{ visibleNotifications().length }} th\u00F4ng b\u00E1o</p>\n </div>\n </div>\n <div class=\"hero-notification-list-dialog__head-actions\">\n <button type=\"button\" class=\"hero-notification__mark-all\"\n (click)=\"openAcknowledgeAllConfirmDialog()\"\n [disabled]=\"notificationSaving() || visibleNotifications().length === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\">\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i> \u0110\u00E3 \u0111\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeNotificationListDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n </div>\n <div class=\"hero-notification-list-dialog__body\">\n @if (visibleNotifications().length > 0) {\n <ul class=\"hero-notification__list\">\n @for (notice of visibleNotifications(); track notice) {\n <li class=\"hero-notification__item\">\n <div class=\"hero-notification__avatar\" aria-hidden=\"true\">{{ notice.user | slice: 0 : 2 | uppercase }}</div>\n <div class=\"hero-notification__body\">\n <div class=\"hero-notification__body-head\">\n <span class=\"hero-notification__author\">{{ notice.user }}</span>\n </div>\n <p class=\"hero-notification__content\">{{ notice.content }}</p>\n @if (notice.createdAt) {\n <span class=\"hero-notification__created\">{{ formatNotificationCreatedAt(notice.createdAt) }}</span>\n }\n </div>\n <div class=\"hero-notification__item-actions\">\n <button type=\"button\" class=\"hero-notification__ack-top\"\n (click)=\"acknowledgeNotification(notice)\" [disabled]=\"notificationSaving()\"\n aria-label=\"\u0110\u00E3 \u0111\u1ECDc th\u00F4ng b\u00E1o\" title=\"\u0110\u00E3 \u0111\u1ECDc\">\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDeleteNotification(notice)) {\n <button type=\"button\" class=\"hero-notification__delete\"\n (click)=\"deleteNotification(notice)\" [disabled]=\"notificationSaving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\" title=\"X\u00F3a th\u00F4ng b\u00E1o\">\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </li>\n }\n </ul>\n } @else {\n <div class=\"hero-notification__empty\">\n <i class=\"pi pi-bell hero-notification__empty-icon\" aria-hidden=\"true\"></i>\n <span class=\"hero-notification__empty-title\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n <span class=\"hero-notification__empty-sub\">M\u1ECDi th\u1EE9 \u0111\u1EC1u \u1ED5n. Th\u00F4ng b\u00E1o m\u1EDBi s\u1EBD xu\u1EA5t hi\u1EC7n \u1EDF \u0111\u00E2y.</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n\n @if (acknowledgeAllConfirmDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeAcknowledgeAllConfirmDialog()\">\n <div class=\"dialog ack-all-confirm-dialog\" role=\"alertdialog\" aria-modal=\"true\"\n aria-labelledby=\"ack-all-confirm-title\" (click)=\"$event.stopPropagation()\">\n <div class=\"ack-all-confirm-dialog__icon-wrap\" aria-hidden=\"true\"><i class=\"pi pi-check-circle\"></i></div>\n <h2 id=\"ack-all-confirm-title\" class=\"ack-all-confirm-dialog__title\">\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc?</h2>\n <p class=\"ack-all-confirm-dialog__desc\">\n T\u1EA5t c\u1EA3 {{ visibleNotifications().length }} th\u00F4ng b\u00E1o s\u1EBD \u0111\u01B0\u1EE3c \u0111\u00E1nh d\u1EA5u \u0111\u00E3 \u0111\u1ECDc v\u00E0 \u1EA9n kh\u1ECFi danh s\u00E1ch.\n </p>\n <div class=\"ack-all-confirm-dialog__actions\">\n <button type=\"button\" class=\"btn ghost\" (click)=\"closeAcknowledgeAllConfirmDialog()\" [disabled]=\"notificationSaving()\">H\u1EE7y</button>\n <button type=\"button\" class=\"btn ack-all-confirm-dialog__confirm-btn\"\n (click)=\"confirmAcknowledgeAll()\" [disabled]=\"notificationSaving()\">\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i> X\u00E1c nh\u1EADn\n </button>\n </div>\n </div>\n </div>\n }\n\n <main\n class=\"content\"\n [class.is-documents]=\"bottomTab() === 'documents'\"\n [class.is-weight]=\"bottomTab() === 'weight'\"\n [class.is-schedule]=\"bottomTab() === 'schedule'\"\n [class.is-mom]=\"bottomTab() === 'mom'\"\n [class.is-medical]=\"bottomTab() === 'medical'\"\n >\n <!--\n ============ TAB PANES ============\n D\u00F9ng `[hidden]` thay v\u00EC `*ngIf` \u0111\u1EC3 c\u00E1c tab c\u00F9ng gi\u1EEF tr\u1EA1ng th\u00E1i khi\n user qua l\u1EA1i: scroll position, search query \u0111ang g\u00F5, viewMode, folder\n \u0111ang \u0111\u1EE9ng, file \u0111ang ch\u1ECDn, draft \u0111ang nh\u1EADp\u2026 \u0111\u1EC1u kh\u00F4ng b\u1ECB reset. H\u1EC7\n qu\u1EA3: `<app-documents>` \u0111\u01B0\u1EE3c mount 1 l\u1EA7n \u1EDF app load \u2014 `loadEntries()`\n ch\u1EA1y 1 l\u1EA7n, c\u00E1c l\u1EA7n switch tab k\u1EBF ti\u1EBFp kh\u00F4ng g\u1ECDi API th\u00EAm.\n -->\n <!-- ============ TAB: DOCUMENTS ============ -->\n @if (explorerEnabled) {\n <div class=\"tab-pane tab-pane--documents\" [hidden]=\"bottomTab() !== 'documents'\">\n <app-documents></app-documents>\n </div>\n }\n\n <!-- ============ TAB: WEIGHT ============ -->\n <div class=\"tab-pane tab-pane--weight\" [hidden]=\"bottomTab() !== 'weight'\">\n <app-weight\n [user]=\"user()\"\n [birthDate]=\"profile()?.birthDate\"\n [gender]=\"profile()?.gender\"\n [babyName]=\"profile()?.babyName\"\n ></app-weight>\n </div>\n\n <!-- ============ TAB: L\u1ECACH \u2014 Google Sheet tab \"Event\" ============ -->\n <div class=\"tab-pane tab-pane--schedule\" [hidden]=\"bottomTab() !== 'schedule'\">\n <app-feeding-schedule [user]=\"user()\"></app-feeding-schedule>\n </div>\n\n <!-- ============ TAB: TI\u1EC0N S\u1EEC Y T\u1EBE \u2014 Medical history V2 ============ -->\n <div class=\"tab-pane tab-pane--medical\" [hidden]=\"bottomTab() !== 'medical'\">\n <app-medical-history\n [user]=\"user()\"\n (openExplorerFile)=\"openMedicalAttachmentInDocuments($event)\"\n ></app-medical-history>\n </div>\n\n <!-- ============ TAB: M\u1EB8 ============ -->\n <div class=\"tab-pane tab-pane--mom\" [hidden]=\"bottomTab() !== 'mom'\">\n <app-feeding-mom\n [profile]=\"profile()\"\n [editing]=\"editing()\"\n (goToFeeding)=\"setBottomTab('feeding')\"\n ></app-feeding-mom>\n </div>\n\n <!-- ============ TAB: FEEDING ============ -->\n <div class=\"tab-pane tab-pane--feeding\" [hidden]=\"bottomTab() !== 'feeding'\">\n <app-feeding-profile\n [user]=\"user()\"\n [profile]=\"profile()\"\n [draft]=\"draft()\"\n [editing]=\"editing()\"\n [maxBirthDate]=\"maxBirthDate\"\n (save)=\"save()\"\n (cancelEdit)=\"cancelEdit()\"\n (startEdit)=\"startEdit()\"\n (clearProfile)=\"clearProfile()\"\n (draftNameChange)=\"updateDraftName($event)\"\n (draftBirthChange)=\"updateDraftBirth($event)\"\n (draftGenderChange)=\"setDraftGender($event)\"\n />\n\n @if (profile() && !editing() && ageBreakdown()) {\n <app-feeding-daily\n [logs]=\"logs()\"\n [feedingSettings]=\"feedingSettings()\"\n [now]=\"now()\"\n [nutritionTarget]=\"nutritionTarget()\"\n [user]=\"user()\"\n [syncMessage]=\"syncMessage()\"\n [syncError]=\"syncError()\"\n [logDialogOpen]=\"logDialogOpen()\"\n [loadingLogs]=\"loadingLogs()\"\n [refreshToken]=\"dailyRefreshToken()\"\n (logsChanged)=\"onFeedingLogsChanged()\"\n (bottlePrepChange)=\"bottlePrep.set($event)\"\n (editLog)=\"feedingDialogs.openEditDialog($event)\"\n (historyOpen)=\"feedingDialogs.openHistoryDialog($event.filter, $event.dateStr)\"\n (feedRowClick)=\"feedingDialogs.onFeedRowClick($event)\"\n >\n <app-feeding-charts\n data-feeding-charts\n [logs]=\"logs()\"\n [now]=\"now()\"\n [nutritionTarget]=\"nutritionTarget()\"\n />\n </app-feeding-daily>\n <app-feeding-nutrition\n [nutritionTarget]=\"nutritionTarget()\"\n [todayStats]=\"todayStats()\"\n [now]=\"now()\"\n [latestWeightKg]=\"latestWeightKgFromSheet()\"\n [editing]=\"editing()\"\n (goToWeight)=\"setBottomTab('weight')\"\n />\n }\n\n <!-- ============ FAB (add feeding log) ============ -->\n @if (profile() && !editing()) {\n <button\n type=\"button\"\n class=\"fab\"\n (click)=\"feedingDialogs.openLogDialog()\"\n aria-label=\"Ghi nh\u1EADn c\u1EEF b\u00FA\"\n title=\"Ghi nh\u1EADn c\u1EEF b\u00FA m\u1EDBi\"\n >\n <i class=\"pi pi-plus\"></i>\n <span class=\"fab-label\">Ghi c\u1EEF b\u00FA</span>\n </button>\n }\n </div>\n <!-- /.tab-pane--feeding -->\n </main>\n </div>\n <!-- /.feeding-page -->\n\n <!-- ============ BOTTOM NAVIGATION ============ -->\n <nav\n class=\"bottom-nav\"\n role=\"tablist\"\n aria-label=\"\u0110i\u1EC1u h\u01B0\u1EDBng ch\u00EDnh\"\n [style.--bn-cols]=\"navTabs().length\"\n [style.--active-index]=\"activeTabIndex()\"\n >\n @for (tab of navTabs(); track tab.id) {\n <button\n type=\"button\"\n class=\"bn-item\"\n role=\"tab\"\n [attr.aria-selected]=\"bottomTab() === tab.id\"\n [class.active]=\"bottomTab() === tab.id\"\n (click)=\"setBottomTab(tab.id)\"\n >\n <span class=\"bn-icon-wrap\">\n <i class=\"pi {{ tab.icon }} bn-icon\" aria-hidden=\"true\"></i>\n </span>\n <span class=\"bn-label\">{{ tab.label }}</span>\n </button>\n }\n </nav>\n\n <!-- About -->\n @if (aboutDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeAboutDialog()\">\n <div\n class=\"dialog about-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby=\"feeding-about-title\"\n (click)=\"$event.stopPropagation()\"\n >\n <div class=\"dialog-head about-dialog__head\">\n <h2 id=\"feeding-about-title\" class=\"about-dialog__title\">\n <i class=\"pi pi-info-circle\" aria-hidden=\"true\"></i>\n About\n </h2>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeAboutDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <dl class=\"about-dialog__meta\">\n <div class=\"about-dialog__row\">\n <dt>\u1EE8ng d\u1EE5ng</dt>\n <dd>{{ appInfo.name }}</dd>\n </div>\n <div class=\"about-dialog__row\">\n <dt>Phi\u00EAn b\u1EA3n</dt>\n <dd>\n <code>{{ appInfo.version }}</code>\n </dd>\n </div>\n </dl>\n <div class=\"dialog-actions\">\n <button type=\"button\" class=\"btn primary\" (click)=\"closeAboutDialog()\">\u0110\u00F3ng</button>\n </div>\n </div>\n </div>\n }\n\n <!-- Nh\u1EAFc s\u1EF1 ki\u1EC7n l\u1ECBch (sheet Event + Settings) -->\n @if (eventReminderDialogOpen() && scheduleReminderEvents().length > 0) {\n <div\n class=\"dialog-overlay dialog-overlay--front dialog-overlay--event-reminder\"\n (click)=\"closeEventReminderDialog()\"\n >\n <div\n class=\"dialog event-reminder-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n (click)=\"$event.stopPropagation()\"\n >\n <div class=\"dialog-head event-reminder-dialog__head\">\n <h2 class=\"event-reminder-dialog__title\">\n <i class=\"pi pi-bell\" aria-hidden=\"true\"></i>\n B\u1EA1n c\u00F3 l\u1ECBch s\u1EAFp t\u1EDBi\n </h2>\n <button\n type=\"button\"\n class=\"dialog-close\"\n (click)=\"closeEventReminderDialog()\"\n aria-label=\"\u0110\u00F3ng\"\n >\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <ul class=\"event-reminder-list\">\n @for (ev of scheduleReminderEvents(); track ev) {\n <li>\n <article class=\"event-reminder-card\">\n <h3 class=\"event-reminder-card__title\">{{ ev.title }}</h3>\n <p class=\"event-reminder-card__datetime\">\n <span class=\"event-reminder-card__date\">{{ formatReminderEventWhen(ev) }}</span>\n <span class=\"event-reminder-card__sep\" aria-hidden=\"true\"> \u2013 </span>\n <span class=\"event-reminder-card__hour\">{{\n formatReminderEventTime(ev.time)\n }}</span>\n </p>\n @if (ev.place) {\n <p class=\"event-reminder-card__place\">\n <i class=\"pi pi-map-marker\" aria-hidden=\"true\"></i>\n <span>{{ ev.place }}</span>\n </p>\n }\n @if (ev.note) {\n <div class=\"event-reminder-card__content-wrap\">\n <span class=\"event-reminder-card__content-label\">N\u1ED9i dung</span>\n <p class=\"event-reminder-card__content\">{{ ev.note }}</p>\n </div>\n }\n </article>\n </li>\n }\n </ul>\n <div class=\"dialog-actions event-reminder-actions\">\n <button\n type=\"button\"\n class=\"event-reminder-actions__link\"\n (click)=\"acknowledgeAllEventReminders()\"\n >\n Kh\u00F4ng nh\u1EAFc l\u1EA1i\n </button>\n <button\n type=\"button\"\n class=\"btn primary event-reminder-actions__primary\"\n (click)=\"skipEventReminderSession()\"\n >\n \u0110\u00E3 hi\u1EC3u\n </button>\n </div>\n </div>\n </div>\n }\n\n <app-feeding-dialogs\n #feedingDialogs\n [logs]=\"logs()\"\n [user]=\"user()\"\n [now]=\"now()\"\n [bottlePrep]=\"bottlePrep()\"\n [feedingSettings]=\"feedingSettings()\"\n [prediction]=\"prediction()\"\n [todayStats]=\"todayStats()\"\n [yesterdayStats]=\"yesterdayStats()\"\n [todayLogs]=\"todayLogs()\"\n [yesterdayLogs]=\"yesterdayLogs()\"\n [maxBirthDate]=\"maxBirthDate\"\n [syncError]=\"syncError()\"\n [syncMessage]=\"syncMessage()\"\n (logsChanged)=\"onFeedingLogsChanged()\"\n (settingsChanged)=\"onFeedingSettingsChanged($event)\"\n (syncErrorChange)=\"syncError.set($event)\"\n (syncMessageChange)=\"syncMessage.set($event)\"\n (logDialogOpenChange)=\"logDialogOpen.set($event)\"\n (bottlePrepClearRequested)=\"clearBottlePrep()\"\n />\n</div>\n<!-- /.feeding-root -->\n", styles: ["@charset \"UTF-8\";:host{display:flex;flex-direction:column;position:absolute;inset:0;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--border-strong: #d1d5db;--primary: #5b6cff;--primary-2: #4c5cf0;--primary-soft: #eef0ff;--accent: #ff5c8a;--accent-soft: #ffe7ef;--mint: #10b981;--mint-soft: #d1fae5;--amber: #f59e0b;--amber-soft: #fef3c7;--rose: #ef4444;--rose-soft: #fee2e2;--text: #0f172a;--muted: #64748b;--muted-2: #94a3b8}.feeding-root{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;position:relative}.feeding-root .bp-prep-user{font-weight:800;color:#0369a1;background:#0ea5e933;padding:0 5px;margin-right:2px;border-radius:5px;white-space:nowrap;transition:color .2s,background .2s}.feeding-root .bp-prep-time{font-weight:800;font-variant-numeric:tabular-nums;color:#0284c7;background:linear-gradient(180deg,#f0f9ff,#e0f2fe);border:1px solid rgba(14,165,233,.35);padding:1px 7px;margin-left:2px;border-radius:6px;white-space:nowrap;box-shadow:0 1px #ffffffa6 inset;transition:color .2s,background .2s,border-color .2s}.feeding-page{position:relative;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;color:var(--text);padding-bottom:calc(170px + env(safe-area-inset-bottom,0px))}.backdrop{position:fixed;inset:0;background:var(--bg);z-index:-1}.hero-notif-wrap{padding:0 16px 8px}.hero{padding:0;background:#fffffff5;border-bottom:1px solid rgba(226,232,240,.9)}@media(max-width:640px){.hero{padding-top:calc(26px + env(safe-area-inset-top,0px));padding-bottom:10px}}.hero-inner{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 18px}.hero-brand{min-width:0}.hero-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;width:100%}.hero-title{display:flex;align-items:center;gap:12px;min-width:0;flex:1}.hero-title .emoji{font-size:36px;line-height:1;flex-shrink:0;filter:drop-shadow(0 2px 4px rgba(15,23,42,.08))}@media(max-width:640px){.hero-title .emoji{font-size:32px}}.hero-title .hero-text{min-width:0}.hero-title h1{margin:0;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.02em;line-height:1.2}@media(max-width:640px){.hero-title h1{font-size:17px}}.hero-title .hero-userline{margin:5px 0 0;display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 6px;font-size:12.5px;color:var(--muted)}.hero-title .hero-userline i{font-size:12px;color:var(--primary);opacity:.9}.hero-title .hero-userline strong{color:var(--primary);font-weight:700;letter-spacing:.01em}.hero-title .hero-userline .hero-last-update{font-size:11px;color:#94a3b8;font-weight:400}.hero--profile-merged{background:var(--primary-soft);padding-bottom:10px;margin-bottom:8px}.hero-title--merged{align-items:flex-start}.hero-title--merged .emoji{font-size:30px}.hero-title--merged h1{font-size:18px;line-height:1.15}.hero-merged-head{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;min-width:0;row-gap:6px}.hero-age-chip{font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:lowercase;color:var(--primary);background:var(--primary-soft);padding:3px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--primary) 18%,transparent);white-space:nowrap}.hero-merged-stat{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:6px;font-size:11px;font-weight:700;color:var(--muted);background:#94a3b824;border:1px solid rgba(148,163,184,.28);white-space:nowrap;line-height:1.25}.hero-merged-stat>i{font-size:10px;opacity:.88;color:var(--muted-2)}.hero-merged-stat--weight>i{color:var(--accent);opacity:1}.hero-merged-meta{margin:5px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:2px 4px;font-size:11.5px;line-height:1.45;color:var(--muted)}.hero-merged-meta .dot{color:var(--muted-2);font-weight:700;-webkit-user-select:none;user-select:none}.hero-merged-meta i{font-size:10px;margin-right:3px;color:var(--muted-2);opacity:.95}.hero-merged-meta strong{color:var(--primary);font-weight:700}.hero-merged-sync{color:#94a3b8;font-weight:400;font-size:11px}.hero-actions--merged{flex-shrink:0}.hero-profile-menu{position:relative;flex:0 0 auto;list-style:none}.hero-profile-menu__trigger{list-style:none}.hero-profile-menu__trigger::-webkit-details-marker{display:none}.hero-profile-menu__trigger::marker{content:\"\"}.hero-profile-menu__panel{position:absolute;top:calc(100% + 6px);right:0;z-index:30;min-width:180px;padding:6px;border-radius:12px;border:1px solid var(--border);background:#fff;box-shadow:0 8px 24px -8px #0f172a2e}.hero-profile-menu__item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:8px;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--text);text-align:left;cursor:pointer;transition:background .12s ease,color .12s ease}.hero-profile-menu__item i{font-size:14px;color:var(--muted-2);width:1.1em;text-align:center}.hero-profile-menu__item:hover:not(:disabled){background:var(--primary-soft, #eef0ff);color:var(--primary)}.hero-profile-menu__item:hover:not(:disabled) i{color:var(--primary)}.hero-profile-menu__item--danger:hover:not(:disabled){color:var(--rose);background:var(--rose-soft)}.hero-profile-menu__item--danger:hover:not(:disabled) i{color:var(--rose)}.about-dialog{max-width:360px}.about-dialog__head{margin-bottom:8px}.about-dialog__title{display:flex;align-items:center;gap:8px;margin:0;font-size:18px;font-weight:700}.about-dialog__title i{color:var(--primary)}.about-dialog__meta{margin:0 0 16px;padding:0}.about-dialog__row{display:grid;grid-template-columns:96px 1fr;gap:8px 12px;padding:10px 0;border-bottom:1px solid var(--border)}.about-dialog__row:last-child{border-bottom:0}.about-dialog__row dt{margin:0;font-size:13px;font-weight:600;color:var(--muted-2)}.about-dialog__row dd{margin:0;font-size:14px;font-weight:600;color:var(--text)}.about-dialog__row dd code{font-size:13px;font-weight:600;padding:2px 8px;border-radius:6px;background:var(--primary-soft, #eef0ff);color:var(--primary)}@media(max-width:640px){.hero-title--merged .emoji{font-size:26px}.hero-merged-meta{font-size:11px}.hero-merged-stat{font-size:10.5px;padding:2px 7px}}.hero-datetime{display:flex;flex-wrap:wrap;align-items:center;flex-shrink:0}.hero-datetime-strip{display:inline-flex;align-items:stretch;flex-wrap:nowrap;max-width:100%;min-height:34px;border:1px solid var(--border);border-radius:8px;background:linear-gradient(180deg,#fff,#f1f5f9);box-shadow:0 1px 1px #0f172a0d}.hero-datetime-strip__block{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;min-width:0}.hero-datetime-strip__block>.pi{font-size:12px;color:var(--primary);opacity:.82;flex-shrink:0}.hero-datetime-strip__block--date{flex-wrap:wrap;row-gap:0}.hero-datetime-strip__wd{font-size:10px;font-weight:700;color:var(--muted);text-transform:capitalize;letter-spacing:.02em;line-height:1.15;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero-datetime-strip__date{font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--text);letter-spacing:.02em;white-space:nowrap}.hero-datetime-strip__divider{align-self:stretch;width:1px;margin:5px 0;background:#94a3b866;flex-shrink:0}.hero-datetime-strip__clock{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.04em;color:var(--primary);line-height:1;white-space:nowrap}.hero-datetime-strip__block--time{padding-right:10px}.hero-datetime-strip__block--time>.pi{font-size:11px}@media(max-width:520px){.hero-inner{flex-direction:column;align-items:stretch}.hero-datetime{width:100%;justify-content:flex-start}.hero-datetime-strip{flex:1 1 auto;width:100%;justify-content:space-between}.hero-notification__composer-row{flex-direction:column;align-items:stretch}.hero-notification__send,.hero-notification__cancel{width:100%;justify-content:center}}.hero-notification__bg-icon{position:absolute;pointer-events:none;color:var(--primary);opacity:.13;line-height:1}.hero-notification__bg-icon i{display:block}.hero-notification__bg-icon--bell{top:8%;left:6%;font-size:28px;transform:rotate(-18deg)}.hero-notification__bg-icon--megaphone{top:10%;right:8%;font-size:24px;transform:rotate(12deg)}.hero-notification__bg-icon--comments{bottom:14%;right:10%;font-size:22px;transform:rotate(-8deg)}.hero-notification__bg-icon--send{bottom:10%;left:50%;font-size:20px;transform:rotate(-22deg)}.hero-notification__bg-icon--star{bottom:16%;left:4%;font-size:18px;transform:rotate(20deg)}.hero-notification__bg-icon--bolt{top:46%;right:2%;font-size:20px;transform:rotate(-5deg)}.hero-notification__bg-icon--heart{top:38%;left:14%;font-size:17px;transform:rotate(15deg)}.hero-notification__bg-icon--info{top:4%;left:50%;font-size:18px;transform:rotate(0)}.hero-notification__bg-icon--check{bottom:24%;left:35%;font-size:17px;transform:rotate(8deg)}.hero-notification__bg-icon--eye{top:14%;left:28%;font-size:18px;transform:rotate(-10deg)}.hero-notification{flex:1 1 100%;display:flex;flex-direction:column;gap:10px;margin-top:2px;padding:10px 12px;border:1px solid rgba(148,163,184,.28);border-radius:14px;background:#fff;position:relative;overflow:hidden}.hero-notification__head{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative}.hero-notification__head-actions{display:inline-flex;align-items:center;gap:6px}.hero-notification__composer-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}.hero-notification__composer-label i{color:var(--primary);font-size:12px}.hero-notification__unread-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--primary);color:#fff;font-size:10px;font-weight:700;line-height:1}.hero-notification__add{width:28px;height:28px;border:1px solid rgba(var(--primary-rgb, 76, 92, 240),.25);border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.1);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}.hero-notification__add i{font-size:11px}.hero-notification__add:hover:not(:disabled){background:var(--primary);border-color:var(--primary);color:#fff}.hero-notification__mark-all{height:26px;border:none;border-radius:0;background:transparent;color:var(--primary);font-size:11px;font-weight:600;padding:0;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:4px}.hero-notification__mark-all i{font-size:10px}.hero-notification__mark-all:hover:not(:disabled){opacity:.75}.hero-notification__mark-all:disabled{color:var(--muted-2);cursor:default}.hero-notification__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;position:relative}.hero-notification__item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid #e2e8f0;position:relative;transition:border-color .18s ease,transform .18s ease}@media(hover:hover){.hero-notification__item:hover{border-color:#c7d2fe;transform:translateY(-1px)}}.hero-notification__avatar{width:34px;height:34px;border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.12);border:1.5px solid rgba(var(--primary-rgb, 76, 92, 240),.22);color:var(--primary);font-size:11px;font-weight:700;letter-spacing:.5px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.hero-notification__body{flex:1;min-width:0;padding-right:52px}.hero-notification__body-head{display:flex;align-items:center;gap:6px;margin-bottom:3px}.hero-notification__author{font-size:12px;font-weight:700;color:var(--text)}.hero-notification__content{margin:0;font-size:13.5px;line-height:1.5;color:var(--text);white-space:pre-wrap;word-break:break-word}.hero-notification__created{display:block;margin-top:4px;font-size:11px;color:#94a3b8;font-variant-numeric:tabular-nums}.hero-notification__item-actions{position:absolute;top:7px;right:8px;display:inline-flex;align-items:center;gap:4px}.hero-notification__ack-top{width:24px;height:24px;border:none;border-radius:50%;background:#eff6ff;color:#1d4ed8;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease}.hero-notification__ack-top i{font-size:10px}.hero-notification__ack-top:active:not(:disabled){transform:scale(.96)}.hero-notification__ack-top:hover:not(:disabled){background:#dbeafe;color:#1e40af}.hero-notification__delete{width:24px;height:24px;border:none;border-radius:50%;background:transparent;color:#94a3b8;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.hero-notification__delete i{font-size:10px}.hero-notification__delete:hover:not(:disabled){background:#fee2e2;color:#b91c1c}.hero-notification__empty{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 8px;position:relative}.hero-notification__empty-icon{font-size:28px;color:var(--primary);opacity:.45;margin-bottom:4px}.hero-notification__empty-title{font-size:13px;font-weight:600;color:var(--muted)}.hero-notification__empty-sub{font-size:11px;color:var(--muted-2);text-align:center}.hero-notification__more{align-self:flex-start;border:none;background:transparent;color:var(--primary);font-size:12px;font-weight:700;cursor:pointer;padding:0;font-family:inherit;position:relative}.hero-notification__more:hover{opacity:.75}.hero-notification__composer-row{display:flex;align-items:stretch;gap:8px;min-width:0}.hero-notification__composer-panel{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid #dbe4f3;border-radius:12px;background:#f8fbff}.hero-notification__input-wrap{flex:1;min-width:0;border-radius:11px;border:1.5px solid #cfd8e6;background:#fff;transition:border-color .15s ease;position:relative}.hero-notification__composer-row:focus-within .hero-notification__input-wrap{border-color:var(--primary)}.hero-notification__input{width:100%;min-width:0;min-height:100px;border:0;border-radius:11px;padding:10px 12px 32px;font-size:13px;line-height:1.45;color:var(--text);background:transparent;font-family:inherit;resize:vertical}.hero-notification__input:focus{outline:none}.hero-notification__char-ring{position:absolute;bottom:8px;right:10px;display:flex;align-items:center;gap:4px;pointer-events:none}.hero-notification__char-ring svg{width:22px;height:22px;transform:rotate(-90deg)}.hero-notification__char-ring-track{fill:none;stroke:#e2e8f0;stroke-width:3}.hero-notification__char-ring-fill{fill:none;stroke:var(--primary);stroke-width:3;stroke-dasharray:94 94;stroke-linecap:round;transition:stroke-dashoffset .2s ease}.hero-notification__char-count{font-size:10px;color:var(--muted-2);font-variant-numeric:tabular-nums}.hero-notification__composer-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.hero-notification__send,.hero-notification__cancel{height:36px;border-radius:10px;min-width:86px;padding:0 14px;font-size:12px;font-weight:700}.hero-notification__send{background:var(--primary);color:#fff}.hero-notification__send:not(:disabled):hover{background:var(--primary-2)}.hero-notification__cancel{min-width:72px}.hero-notification__error{margin:0;font-size:12px;color:#b91c1c;position:relative}.hero-notification-dialog{max-width:min(520px,100vw - 24px);overflow:hidden}.hero-notification-dialog .hero-notification__composer-row{align-items:stretch;gap:10px}.hero-notification-dialog .hero-notification__input-wrap{min-height:110px}.hero-notification-dialog__head{margin-bottom:14px}.hero-notification-dialog__title-group{display:flex;align-items:flex-start;gap:10px}.hero-notification-dialog__icon-wrap{width:34px;height:34px;border-radius:10px;background:rgba(var(--primary-rgb, 76, 92, 240),.12);border:1px solid rgba(var(--primary-rgb, 76, 92, 240),.22);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.hero-notification-dialog__icon-wrap i{font-size:14px}.hero-notification-dialog__title{margin:0;font-size:15px;font-weight:800;color:var(--text);line-height:1.3}.hero-notification-dialog__subtitle{margin:2px 0 0;font-size:11px;color:var(--muted-2)}.hero-notification-list-dialog{max-width:min(620px,100vw - 24px)}.hero-notification-list-dialog__head{margin-bottom:10px;align-items:flex-start}.hero-notification-list-dialog__head-actions{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}.hero-notification-list-dialog__title{margin:0;font-size:15px;font-weight:800;color:var(--text);line-height:1.3}.hero-notification-list-dialog__body{max-height:min(60vh,480px);overflow-y:auto;padding-right:2px}.ack-all-confirm-dialog{max-width:min(380px,100vw - 24px);text-align:center;padding:28px 24px 24px;display:flex;flex-direction:column;align-items:center;gap:10px;overflow:hidden}.ack-all-confirm-dialog__icon-wrap{width:52px;height:52px;border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.1);border:1.5px solid rgba(var(--primary-rgb, 76, 92, 240),.2);color:var(--primary);display:flex;align-items:center;justify-content:center;margin-bottom:2px}.ack-all-confirm-dialog__icon-wrap i{font-size:22px}.ack-all-confirm-dialog__title{margin:0;font-size:16px;font-weight:800;color:var(--text)}.ack-all-confirm-dialog__desc{margin:0;font-size:13px;color:var(--muted);line-height:1.55;max-width:280px}.ack-all-confirm-dialog__actions{display:flex;gap:10px;margin-top:6px;width:100%;justify-content:center}.ack-all-confirm-dialog__actions .btn{min-width:96px;height:38px;border-radius:10px;font-size:13px;font-weight:700}.ack-all-confirm-dialog__confirm-btn{background:var(--primary);color:#fff;display:inline-flex;align-items:center;gap:6px}.ack-all-confirm-dialog__confirm-btn i{font-size:12px}.ack-all-confirm-dialog__confirm-btn:not(:disabled):hover{background:var(--primary-2)}.hero-actions{display:flex;gap:8px;align-items:center;flex-shrink:0;align-self:center}.content{width:100%}.content .tab-pane[hidden]{display:none!important}.content .tab-pane--feeding{max-width:1100px;margin:0 auto;padding:0 20px}.content .tab-pane--documents{max-width:none;padding:0}.content .tab-pane--weight{max-width:none;padding:0;background:linear-gradient(180deg,color-mix(in srgb,var(--primary, #5b6cff) 5%,var(--surface, #fff)) 0%,var(--surface, #fff) min(36vh,280px),var(--surface, #fff) 100%)}.content .tab-pane--mom{max-width:1100px;margin:0 auto;padding:0 20px calc(24px + env(safe-area-inset-bottom,0px))}.content .tab-pane--medical{max-width:none;padding:0;background:linear-gradient(180deg,color-mix(in srgb,var(--primary, #5b6cff) 7%,var(--surface, #fff)) 0%,var(--surface, #fff) min(42vh,320px),var(--surface, #fff) 100%)}.bottom-nav{--bn-primary: #5b6cff;--bn-primary-rgb: 91, 108, 255;--bn-inactive: #b0b7c3;--bn-height: 62px;left:0;right:0;bottom:0;width:100%;box-sizing:border-box;z-index:90;position:fixed;display:grid;grid-template-columns:repeat(var(--bn-cols, 5),1fr);align-items:center;min-height:var(--bn-height);padding:0 4px;background:#fffffff5;backdrop-filter:blur(24px) saturate(200%);-webkit-backdrop-filter:blur(24px) saturate(200%);border-top:1px solid rgba(0,0,0,.055);box-shadow:0 -4px 24px -4px #0f172a14}.bottom-nav:before{content:\"\";position:absolute;top:50%;margin-top:0;width:calc(100% / var(--bn-cols, 5));height:48px;left:calc(var(--active-index, 0) * 100% / var(--bn-cols, 5));transform:translateY(-50%);transition:left .32s cubic-bezier(.65,0,.35,1);pointer-events:none;z-index:0;border-radius:16px;background:linear-gradient(145deg,rgba(var(--bn-primary-rgb),.14),rgba(var(--bn-primary-rgb),.06));margin-left:6px;width:calc(100% / var(--bn-cols, 5) - 12px)}.bottom-nav .bn-item{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:var(--bn-height);padding:0 2px;background:transparent;border:none;color:var(--bn-inactive);cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;transition:color .22s ease}.bottom-nav .bn-item .bn-icon-wrap{display:flex;align-items:center;justify-content:center;width:32px;height:30px;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.bottom-nav .bn-item .bn-icon{font-size:21px;line-height:1;transition:filter .22s ease;display:block}.bottom-nav .bn-item .bn-label{font-size:10px;font-weight:500;letter-spacing:.025em;line-height:1;transition:font-weight .22s ease}.bottom-nav .bn-item:not(.active):hover{color:rgba(var(--bn-primary-rgb),.7)}.bottom-nav .bn-item:active .bn-icon-wrap{transform:scale(.88)}.bottom-nav .bn-item.active{color:var(--bn-primary)}.bottom-nav .bn-item.active .bn-icon-wrap{transform:translateY(-3px) scale(1.15)}.bottom-nav .bn-item.active .bn-icon{filter:drop-shadow(0 2px 8px rgba(var(--bn-primary-rgb),.4))}.bottom-nav .bn-item.active .bn-label{font-weight:700}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:16px}.card-header{margin-bottom:16px}.card-header h2{margin:0;font-size:18px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:8px}.card-header h2 i{color:var(--primary)}.card-header p{margin:6px 0 0;color:var(--muted);font-size:13px}.eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted-2);letter-spacing:.06em}.eyebrow i{margin-right:4px}.form{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field .label{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.field .label .label-hint{font-size:11px;font-weight:500;color:var(--muted-2);font-style:italic;text-transform:none;letter-spacing:0}.field input[type=text],.field input[type=date],.field input[type=time],.field input[type=number]{padding:12px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:14px;font-family:inherit;color:var(--text);background:#fafbfc;width:100%;min-width:0;box-sizing:border-box;appearance:none;-webkit-appearance:none;transition:border-color .15s,background .15s;min-height:46px;font-variant-numeric:tabular-nums}.field input[type=text]:focus,.field input[type=date]:focus,.field input[type=time]:focus,.field input[type=number]:focus{outline:none;border-color:var(--primary);background:#fff}.field input[type=text]::placeholder,.field input[type=date]::placeholder,.field input[type=time]::placeholder,.field input[type=number]::placeholder{color:var(--muted-2)}.field input[type=number]{-moz-appearance:textfield}.field input[type=number]::-webkit-outer-spin-button,.field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.radio-group{display:flex;gap:8px;flex-wrap:wrap}.chip{padding:9px 16px;border:1.5px solid var(--border);background:#fff;border-radius:999px;font-size:13px;cursor:pointer;color:var(--text);transition:all .15s;font-family:inherit}.chip:hover{border-color:var(--primary);color:var(--primary)}.chip.active{background:var(--primary);border-color:var(--primary);color:#fff}.form-actions{display:flex;gap:10px;margin-top:4px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border:none;border-radius:10px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.small{padding:6px 12px;font-size:12px}.btn.primary{background:var(--primary);color:#fff}.btn.primary:not(:disabled):hover{background:var(--primary-2)}.btn.ghost{background:transparent;color:var(--muted);border:1.5px solid var(--border)}.btn.ghost:hover{color:var(--text);border-color:var(--border-strong)}.btn.danger-ghost{background:transparent;color:var(--rose);border:1.5px solid var(--rose-soft)}.btn.danger-ghost:hover{background:var(--rose-soft)}.btn.icon-btn{padding:0;width:36px;height:36px;justify-content:center;background:transparent;color:var(--muted);border:1.5px solid var(--border);border-radius:10px}.btn.icon-btn i{font-size:14px}.btn.icon-btn:not(:disabled):hover{color:var(--primary);border-color:var(--primary);background:var(--primary-soft)}.btn.icon-btn .spin{animation:spin-refresh .9s linear infinite}@keyframes spin-refresh{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.age-stats{display:flex;align-items:baseline;justify-content:flex-start;gap:16px;padding:14px 16px;background:var(--primary-soft);border-radius:12px}.age-stats .stat{text-align:center}.age-stats .stat .num{font-size:26px;font-weight:700;color:var(--primary);line-height:1;font-variant-numeric:tabular-nums}.age-stats .stat .unit{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-top:3px}.age-stats .dot{color:var(--muted-2);font-size:20px}.period-card{margin-bottom:0}.period-card h2{margin:6px 0 8px;font-size:20px;font-weight:700}.period-card .period-summary{color:var(--muted);font-size:14px;margin:0 0 14px;line-height:1.55}.schedule-grid{display:grid;grid-template-columns:1fr;gap:10px}.schedule{display:flex;gap:12px;padding:12px;background:#fafbfc;border:1px solid var(--border);border-radius:12px}.schedule i{color:var(--primary);font-size:18px;margin-top:2px}.schedule .schedule-title{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}.schedule .schedule-text{font-size:14px;color:var(--text);line-height:1.5}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}@media(max-width:768px){.compare-grid{grid-template-columns:1fr}}.day-card{margin-bottom:0;min-width:0;overflow:hidden}.day-card.today{border-color:#3b82f6;background:linear-gradient(180deg,#dbeafe,#fff 50%)}.day-card.yesterday{background:#fafbfc}.day-date-nav-wrap{position:relative;margin-bottom:12px}.day-date-nav-reset{position:absolute;top:-8px;right:-8px;z-index:1;width:24px;height:24px;border:1px solid var(--border);border-radius:50%;background:#fff;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:0 1px 3px #0f172a14}.day-date-nav-reset i{font-size:10px}.day-date-nav-reset:hover{background:#fee2e2;border-color:#fecaca;color:#dc2626}.day-date-nav-reset:active{background:#fee2e2;color:#dc2626}.day-date-strip{display:grid;grid-template-columns:32px 1fr 32px;gap:6px;align-items:stretch;padding:6px 8px;border-radius:10px;background:#fff;border:1px solid var(--border);touch-action:manipulation}.day-date-strip-scroller{display:flex;gap:4px;min-width:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding:1px 2px}.day-date-strip-scroller::-webkit-scrollbar{height:4px}.day-date-strip-scroller::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}.day-date-strip-day{flex:0 0 64px;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;padding:6px 4px;border:1px solid transparent;border-radius:8px;background:#f8fafc;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.day-date-strip-day:hover{background:#eef2ff;border-color:#c7d2fe}.day-date-strip-day.active{background:#dbeafe;border-color:#3b82f6;box-shadow:inset 0 0 0 1px #3b82f626}.day-date-strip-date{font-size:12px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2}.day-date-strip-ml{font-size:11px;font-weight:600;color:#1d4ed8;font-variant-numeric:tabular-nums;line-height:1.2}.day-date-strip-ml.empty{color:var(--muted);font-weight:500}.day-date-strip-arrow{width:32px;min-height:52px;flex-shrink:0;border:none;border-radius:8px;background:#f1f5f9;color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.day-date-strip-arrow i{font-size:12px}.day-date-strip-arrow:hover:not(:disabled){background:var(--primary);color:#fff}.day-date-strip-arrow:active:not(:disabled){background:var(--primary);color:#fff}.day-date-strip-arrow:disabled{opacity:.35;cursor:not-allowed}.day-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.day-head h3{margin:4px 0 0;font-size:16px;color:var(--text);font-variant-numeric:tabular-nums}.big-total{display:flex;align-items:baseline;gap:3px}.big-total .num{font-size:32px;font-weight:800;color:var(--text);line-height:1;font-variant-numeric:tabular-nums}.big-total .unit{font-size:14px;color:var(--muted);font-weight:500}.day-stats{display:flex;flex-wrap:wrap;gap:10px 16px;padding:10px 0 0;border-top:1px solid var(--border)}.day-stats>div{font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:5px}.day-stats>div i{color:var(--primary);font-size:12px}.compare-banner{margin-top:12px;padding:12px;background:var(--primary-soft);border-radius:12px;font-size:12px;color:var(--text);display:flex;flex-direction:column;gap:8px}.compare-banner strong{color:var(--primary);font-variant-numeric:tabular-nums;font-weight:700}.compare-banner .compare-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.compare-banner .compare-row:not(:last-child){padding-bottom:8px;border-bottom:1px dashed rgba(15,23,42,.1)}.compare-banner .compare-stats{display:flex;align-items:center;gap:6px;flex:1}.compare-banner .compare-stats .label{color:var(--muted);font-weight:500;font-size:11px}.compare-banner .compare-stats .count{color:var(--muted-2);font-size:11px}.compare-banner .compare-change{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;flex-shrink:0}.compare-banner .compare-change i{font-size:10px}.compare-banner .compare-change i.up{color:var(--mint)}.compare-banner .compare-change i.down{color:var(--amber)}.compare-banner .compare-change strong{font-size:12px}.compare-banner .compare-change span{color:var(--muted-2);font-weight:500}.today-logs{margin-top:12px;padding:12px;background:#fafbfc;border:1px solid var(--border);border-radius:12px}.logs-header{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}.logs-header span{display:flex;align-items:center;gap:6px}.logs-header span:before{content:\"\\1f37c\";font-size:14px}.logs-header .logs-more{text-transform:none;letter-spacing:0;background:transparent;border:none;color:var(--primary);font-size:12px;font-weight:600;padding:4px 8px;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;gap:3px;transition:background .2s ease}.logs-header .logs-more i{font-size:10px}.logs-header .logs-more:hover{background:var(--primary-soft)}.log-list{display:flex;flex-direction:column;gap:6px;min-width:0}.log-row{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#fafbfc;border-radius:8px;font-size:13px;min-width:0;max-width:100%;transition:all .2s ease;position:relative}.log-row.low-volume .log-volume{color:#f59e0b;font-weight:900}.log-row.high-volume .log-volume{color:#10b981;font-weight:900}.log-row:hover{background:#f1f5f9;transform:translateY(-1px);box-shadow:0 2px 8px #0000000d}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.log-time{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;min-width:42px}.log-volume{font-weight:800;color:var(--primary);font-size:16px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.log-gap{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;background:#f3f4f6;color:#6b7280;border-radius:999px;font-size:10.5px;font-weight:600;white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums;transition:all .2s ease}.log-gap i{font-size:9px;opacity:.7}.log-gap.feed-gap-warn{background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-weight:700;border:1px solid rgba(234,88,12,.45);box-shadow:0 0 0 1px #fff3 inset,0 2px 8px #ea580c59}.log-gap.feed-gap-warn i{opacity:.95;color:inherit}.log-note{color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.log-actions{margin-left:auto;display:inline-flex;align-items:center;gap:2px}.log-edit,.log-del{background:transparent;border:none;color:var(--muted-2);cursor:pointer;padding:4px 6px;border-radius:6px;font-size:12px;transition:all .2s ease}.log-edit:hover{color:var(--primary);background:var(--primary-soft)}.log-del:hover{color:var(--rose);background:var(--rose-soft)}.empty-mini{padding:12px;text-align:center;color:var(--muted-2);font-size:13px;font-style:italic}.countdown-hero{display:flex;flex-direction:column;gap:16px;padding:18px 20px;background:#fff;border-radius:16px;border:1px solid #e6e9ff;transition:all .3s ease;margin-bottom:20px}.countdown-hero .hero-main{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:20px}.countdown-hero .feeding-time-card{flex:1;min-width:0;text-align:center}.countdown-hero .feeding-time-card .time-header{margin-bottom:12px;display:flex;justify-content:center}.countdown-hero .feeding-time-card .time-header .status-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:6px 12px;border-radius:14px;white-space:nowrap}.countdown-hero .feeding-time-card .time-header .status-badge i{font-size:11px}.countdown-hero .feeding-time-card .time-header .status-badge.status-waiting{background:var(--primary-soft);color:var(--primary)}.countdown-hero .feeding-time-card .time-header .status-badge.status-now{background:#fee2e2;color:#dc2626;animation:pulse-gentle 2s ease-in-out infinite;font-size:11px;text-transform:none;font-weight:700}.countdown-hero .feeding-time-card .time-header .status-badge.status-late{background:var(--rose-soft);color:var(--rose)}.countdown-hero .feeding-time-card .time-display .predicted-time{font-size:42px;font-weight:800;line-height:1;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin-bottom:4px}.countdown-hero .feeding-time-card .time-display .time-remaining{font-size:15px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}.countdown-hero .countdown-next{display:flex;flex-direction:column;gap:8px;padding-left:16px;border-left:1px dashed #d8dcff;flex-shrink:0;min-width:0}.countdown-hero .next-item{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.countdown-hero .next-item i{color:var(--primary);font-size:13px}.countdown-hero .next-item strong{font-weight:700}.countdown-hero .next-item .predict-label,.countdown-hero .next-item .recommend-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);margin-left:4px}.countdown-hero .next-item .recommend-label{color:var(--mint)}.countdown-hero .volume-info{display:flex;flex-direction:column;gap:8px;padding-left:20px;border-left:1px dashed #d8dcff;flex-shrink:0;min-width:160px;transition:all .3s ease}.countdown-hero .volume-info .volume-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.countdown-hero .volume-info .volume-row .volume-prefix{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);flex-shrink:0}.countdown-hero .volume-info .volume-row .volume-amount{font-size:22px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1;text-align:right}.countdown-hero .volume-info .volume-row.predicted-row .volume-prefix,.countdown-hero .volume-info .volume-row.predicted-row .volume-amount{color:var(--primary)}.countdown-hero .volume-info .volume-row.recommended-row .volume-prefix,.countdown-hero .volume-info .volume-row.recommended-row .volume-amount{color:var(--mint)}.countdown-hero[data-status=waiting]{border-color:#bbf7d0;background:linear-gradient(135deg,#f7fef8,#f0fdf4)}.countdown-hero[data-status=waiting] .feeding-time-card .time-display .predicted-time{color:#16a34a}.countdown-hero[data-status=waiting] .feeding-time-card .time-display .time-remaining{color:#15803d}.countdown-hero[data-status=waiting] .feeding-time-card .status-badge.status-waiting{background:#dcfce7!important;color:#15803d!important;border:1px solid #86efac}.countdown-hero[data-status=waiting] .volume-info .volume-amount{color:#16a34a}.countdown-hero[data-status=waiting] .volume-info .volume-prefix{color:#15803d}.countdown-hero[data-status=late]{border-color:#fca5a5;background:linear-gradient(135deg,#fef2f2,#fee2e2)}.countdown-hero[data-status=late] .feeding-time-card .time-display .predicted-time{color:#dc2626}.countdown-hero[data-status=late] .feeding-time-card .time-display .time-remaining{color:#b91c1c}.countdown-hero[data-status=late] .feeding-time-card .status-badge.status-late{background:#fee2e2;color:#dc2626;border:1px solid #fca5a5}.countdown-hero[data-status=late] .volume-info .volume-amount{color:#dc2626}.countdown-hero[data-status=late] .volume-info .volume-prefix{color:#b91c1c}.countdown-hero[data-status=now]{border-color:#fbbf24;background:linear-gradient(135deg,#fefce8,#fef3c7);animation:pulse-card 2s ease-in-out infinite}.countdown-hero[data-status=now] .feeding-time-card .time-display .predicted-time{color:#92400e}.countdown-hero[data-status=now] .feeding-time-card .time-display .time-remaining{color:#a16207}.countdown-hero[data-status=now] .feeding-time-card .status-badge.status-now{background:#fef3c7!important;color:#b45309!important;border:1px solid #f59e0b!important}.countdown-hero[data-status=now] .volume-info .volume-amount{color:#92400e}.countdown-hero[data-status=now] .volume-info .volume-prefix{color:#a16207}@media(max-width:540px){.countdown-hero .hero-main{flex-direction:column;align-items:stretch;gap:12px}.countdown-hero .hero-main .volume-info{border-left:none;border-top:1px dashed #d8dcff;padding-left:0;padding-top:12px;min-width:auto}.countdown-hero .hero-main .volume-info .volume-row{justify-content:space-between;padding:0 4px}.countdown-hero .hero-main .feeding-time-card .time-display .predicted-time{font-size:36px}.countdown-hero .hero-main .feeding-time-card .volume-info .volume-amount{font-size:20px}}@media(max-width:400px){.countdown-hero .feeding-time-card .status-badge{font-size:10px;padding:4px 10px}.countdown-hero .feeding-time-card .time-display .predicted-time{font-size:32px}.countdown-hero .volume-info .volume-amount{font-size:18px}}@keyframes pulse-soft{0%,to{opacity:1}50%{opacity:.65}}@keyframes pulse-gentle{0%,to{opacity:1}50%{opacity:.75}}@keyframes pulse-urgent{0%,to{opacity:1;text-shadow:0 0 0 rgba(239,68,68,0)}50%{opacity:.8;text-shadow:0 0 8px rgba(239,68,68,.25)}}@keyframes pulse-card{0%,to{transform:scale(1);box-shadow:0 1px 3px #0000001a,0 0 #f8717100}50%{transform:scale(1.02);box-shadow:0 4px 12px #00000026,0 0 0 2px #f871714d}}.burp-warning{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;margin:0 0 16px;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #f59e0b;border-radius:14px;box-shadow:0 2px 8px #f59e0b33;animation:burp-pulse 2s ease-in-out infinite}.burp-warning__icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#f59e0b;border-radius:50%;color:#fff;font-size:18px;animation:burp-icon-bounce 1.5s ease-in-out infinite}.burp-warning__content{flex:1;min-width:0}.burp-warning__title{font-size:15px;font-weight:700;color:#92400e;margin-bottom:4px}.burp-warning__text{font-size:13px;color:#78350f;line-height:1.5;margin-bottom:8px}.burp-warning__text strong{font-weight:600;color:#92400e}.burp-warning__countdown{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#ffffffb3;border-radius:8px;font-size:13px;color:#92400e;font-weight:500}.burp-warning__countdown i{font-size:14px;color:#f59e0b}.burp-warning__countdown strong{font-size:16px;font-weight:700;color:#d97706}@keyframes burp-pulse{0%,to{box-shadow:0 2px 8px #f59e0b33}50%{box-shadow:0 4px 16px #f59e0b59}}@keyframes burp-icon-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.countdown-progress{margin-top:10px}.countdown-progress .cp-track{position:relative;height:6px;background:#ffffffbf;border-radius:999px;overflow:hidden}.countdown-progress .cp-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:999px;transition:width .4s ease}.countdown-progress .cp-fill[data-status=waiting]{background:linear-gradient(90deg,#22c55e,#16a34a)}.countdown-progress .cp-fill[data-status=late]{background:linear-gradient(90deg,#f87171,#dc2626)}.countdown-progress .cp-fill[data-status=now]{background:linear-gradient(90deg,#fbbf24,#d97706)}.countdown-progress .cp-labels{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;font-size:11.5px;color:var(--muted)}.countdown-progress .cp-labels i{font-size:10px;margin-right:2px;color:var(--muted-2)}.countdown-progress .cp-labels .muted{color:var(--muted-2)}.countdown-progress .cp-labels .cp-right{font-weight:600;color:var(--muted);white-space:nowrap}.predict-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:12px;margin-bottom:16px}.predict-head .eyebrow{color:var(--primary);display:flex;align-items:center;gap:4px}.predict-head .eyebrow.sparkle i{animation:sparkle 2s ease-in-out infinite}.predict-head h2{margin:4px 0 0;font-size:20px;font-weight:700}.last-feed{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;border-radius:12px;margin-bottom:14px;border:1px solid #e8e9ff}.last-feed .last-feed-icon{width:38px;height:38px;border-radius:50%;background:var(--primary-soft);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.last-feed .last-feed-icon i{color:var(--primary);font-size:16px}.last-feed .last-feed-body{flex:1;min-width:0}.last-feed .last-feed-label{font-size:10px;font-weight:700;text-transform:uppercase;color:var(--muted-2);letter-spacing:.06em;margin-bottom:2px}.last-feed .last-feed-value{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.last-feed .last-feed-value strong{color:var(--primary);font-size:18px;font-weight:800}.last-feed .last-feed-value .sep{color:var(--muted-2)}.last-feed .last-feed-value .ago{color:var(--accent);font-weight:600;font-size:13px}.last-feed .last-feed-note{margin-top:4px;font-size:12px;color:var(--muted);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.predict-empty{padding:14px 16px;background:#fff;border-radius:12px;color:var(--muted);font-size:13px;display:flex;align-items:center;gap:8px}.predict-empty i{color:var(--primary)}.predict-body{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}@media(max-width:640px){.predict-body{grid-template-columns:1fr}}.predict-metric{background:#fff;border-radius:12px;padding:14px;text-align:center}.predict-metric .metric-label{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;display:flex;align-items:center;justify-content:center;gap:5px}.predict-metric .metric-label i{color:var(--primary);font-size:12px}.predict-metric .metric-value{font-size:28px;font-weight:800;line-height:1;color:var(--primary);font-variant-numeric:tabular-nums}.predict-metric .metric-value .ml-unit{font-size:14px;color:var(--muted);font-weight:500;margin-left:2px}.predict-metric .metric-sub{margin-top:6px;font-size:12px;color:var(--muted)}.reasoning{background:#fff;border-radius:12px;padding:12px 14px;margin-bottom:12px}.reasoning .reasoning-head{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted);letter-spacing:.05em;margin-bottom:6px}.reasoning .reasoning-head i{color:var(--primary);margin-right:4px}.reasoning ul{margin:0;padding-left:18px;list-style:disc}.reasoning li{font-size:13px;color:var(--text);line-height:1.55;margin:2px 0}.predict-actions{display:flex;justify-content:flex-end}.feed-list-card{margin-bottom:16px}.feed-list-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.feed-list-head h2{margin:4px 0 0;font-size:18px;font-weight:700}.feed-list-compact{display:flex;flex-direction:column;gap:6px}.feed-row{display:grid;grid-template-columns:68px 80px 1fr auto;gap:10px;align-items:center;padding:10px 12px;transition:all .2s ease;position:relative}.feed-row.low-volume .feed-row-volume strong{color:#f59e0b;font-weight:900}.feed-row.high-volume .feed-row-volume strong{color:#10b981;font-weight:900}.feed-row{background:#fafbfc;border-radius:10px;border:1px solid var(--border)}.feed-row .feed-row-time{display:flex;flex-direction:column;line-height:1.2;font-variant-numeric:tabular-nums;gap:3px}.feed-row .feed-row-time .time{font-weight:700;color:var(--text);font-size:14px}.feed-row .feed-row-time .date{font-size:11px;color:var(--muted-2)}.feed-row .feed-row-time .feed-row-gap{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:600;color:#6b7280;background:#f3f4f6;padding:1px 6px;border-radius:999px;width:fit-content;white-space:nowrap;font-variant-numeric:tabular-nums}.feed-row .feed-row-time .feed-row-gap i{font-size:8px;opacity:.7}.feed-row .feed-row-time .feed-row-gap.feed-gap-warn{background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-weight:700;border:1px solid rgba(234,88,12,.45);box-shadow:0 0 0 1px #fff3 inset,0 2px 8px #ea580c59}.feed-row .feed-row-time .feed-row-gap.feed-gap-warn i{opacity:.95;color:inherit}.feed-row .feed-row-volume{font-variant-numeric:tabular-nums}.feed-row .feed-row-volume strong{color:var(--primary);font-size:19px;font-weight:800;letter-spacing:-.01em}.feed-row .feed-row-volume .u{font-size:11px;color:var(--muted);margin-left:2px}.feed-row .feed-row-note{font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.feed-row .feed-row-note.muted{color:var(--muted-2);font-style:italic}.feed-row .feed-row-actions{display:inline-flex;align-items:center;gap:2px;margin-left:auto}.feed-row .feed-row-edit,.feed-row .feed-row-del{background:transparent;border:none;color:var(--muted-2);cursor:pointer;padding:6px 8px;border-radius:6px;font-size:13px}.feed-row .feed-row-edit:hover{color:var(--primary, #5b6cff);background:#5b6cff1a}.feed-row .feed-row-del:hover{color:var(--rose);background:var(--rose-soft)}@media(max-width:480px){.feed-row{grid-template-columns:58px 70px 1fr auto;gap:8px;padding:8px 10px}.feed-row .feed-row-time .time{font-size:13px}}.dialog-wide{max-width:720px;display:flex;flex-direction:column;padding:0;overflow:hidden}@media(max-width:640px){.dialog-wide{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 72px);border-radius:14px}}.dialog-wide .dialog-head{position:sticky;top:0;z-index:5;background:var(--surface);padding:16px 20px;margin:0;border-bottom:1px solid var(--border);-webkit-backdrop-filter:saturate(1.2) blur(6px);backdrop-filter:saturate(1.2) blur(6px)}@media(max-width:640px){.dialog-wide .dialog-head{padding:12px 14px}}.dialog-wide .dialog-close{width:40px;height:40px;font-size:16px;background:#f1f3f7;color:var(--text)}.dialog-wide .dialog-close:hover{background:var(--rose-soft);color:var(--rose)}.dialog-wide .history-body,.dialog-wide .tips-dialog-body{padding:18px 20px 24px;overflow-y:auto;flex:1;min-height:0}@media(max-width:640px){.dialog-wide .history-body,.dialog-wide .tips-dialog-body{padding:14px 14px 20px}}.history-body{display:flex;flex-direction:column;gap:18px}.history-paging-hint{margin:0;font-size:12px;line-height:1.45}.history-load-more{display:grid;justify-items:center;width:100%;box-sizing:border-box;padding:8px 0 12px}.history-load-more .btn{width:auto;max-width:min(320px,100%);min-width:0;margin-inline:auto;justify-content:center}.tips-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;background:#f1f3f7;border-radius:12px;margin-bottom:16px}.nav-arrow{width:40px;height:40px;border-radius:50%;border:none;background:#fff;color:var(--primary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:16px;transition:all .15s;flex-shrink:0}.nav-arrow:hover:not(:disabled){background:var(--primary);color:#fff;transform:scale(1.05)}.nav-arrow:active:not(:disabled){transform:scale(.95)}.nav-arrow:disabled{opacity:.35;cursor:not-allowed}.tips-now-btn{flex:1;padding:9px 16px;border:none;background:transparent;border-radius:999px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:all .15s}.tips-now-btn i{font-size:12px}.tips-now-btn:hover{color:var(--primary);background:#fff}.tips-now-btn.active{background:var(--primary);color:#fff;pointer-events:none}.tips-dialog-body .period-summary{font-size:14px;color:var(--muted);line-height:1.6;margin:0 0 14px}.tips-dialog-body .schedule-grid{grid-template-columns:repeat(2,1fr);margin-bottom:16px}@media(max-width:560px){.tips-dialog-body .schedule-grid{grid-template-columns:1fr}}.dialog-tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.history-group .history-group-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--primary-soft);border-radius:10px;margin-bottom:8px}.history-group .history-group-head .h-date{font-size:14px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.history-group .history-group-head .h-day{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.history-group .history-group-head .h-total{font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.history-group .history-group-head .h-total strong{color:var(--primary);font-size:20px;font-weight:800}.history-group .history-group-head .h-total .h-count{color:var(--muted);font-size:12px;font-weight:500;margin-left:4px}.history-group .history-group-head .h-total .h-avg{color:var(--primary);font-size:12px;font-weight:600;margin-left:4px;font-variant-numeric:tabular-nums}.history-group .history-group-rows{display:flex;flex-direction:column;gap:4px}.tips-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:4px 4px 0}.tips-section-head .eyebrow i{margin-right:4px}.tips-section-head h2{margin:4px 0 0;font-size:20px;font-weight:700;color:var(--text)}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.filter-chip{padding:7px 14px;border:1.5px solid var(--border);background:#fff;border-radius:999px;font-size:13px;font-weight:500;cursor:pointer;color:var(--muted);display:inline-flex;align-items:center;gap:5px;transition:all .15s;font-family:inherit}.filter-chip i{font-size:12px}.filter-chip:hover{border-color:var(--cat-color, var(--primary));color:var(--cat-color, var(--primary))}.filter-chip.active{background:var(--cat-color, var(--primary));border-color:var(--cat-color, var(--primary));color:#fff}.tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:20px}.tip-card{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--cat-color, var(--primary));border-radius:12px;padding:16px;transition:transform .15s}.tip-card:hover{transform:translateY(-2px)}.tip-card .tip-head{margin-bottom:8px}.tip-card .tip-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;background:var(--cat-color, var(--primary));color:#fff;font-size:11px;font-weight:600;border-radius:999px;text-transform:uppercase;letter-spacing:.04em}.tip-card .tip-pill i{font-size:10px}.tip-card .tip-title{margin:6px 0 8px;font-size:15px;font-weight:700;line-height:1.35;color:var(--text)}.tip-card .tip-body{margin:0;font-size:13px;line-height:1.55;color:var(--muted)}.empty{grid-column:1/-1;padding:40px 20px;text-align:center;color:var(--muted-2)}.empty i{font-size:32px;margin-bottom:8px;display:block}.upcoming{margin-bottom:24px}.upcoming h3{margin:0 0 12px;font-size:16px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px}.upcoming h3 i{color:var(--primary)}.upcoming-grid{display:flex;gap:8px;flex-wrap:wrap}.upcoming-item{padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:10px;font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}.upcoming-item i{color:var(--primary);font-size:12px}.disclaimer{padding:16px;background:var(--amber-soft);border-radius:12px;color:#78350f;font-size:13px;line-height:1.5;margin-bottom:24px;display:flex;gap:8px;align-items:flex-start}.disclaimer i{color:var(--amber);margin-top:2px}.toast{position:fixed;bottom:100px;left:50%;transform:translate(-50%);z-index:90;padding:12px 18px;border-radius:12px;font-size:14px;font-weight:500;box-shadow:0 6px 24px #0f172a1f;display:flex;align-items:center;gap:8px;animation:toastIn .3s cubic-bezier(.4,0,.2,1)}.toast.success{background:var(--mint);color:#fff}.toast.error{background:var(--rose);color:#fff}@keyframes toastIn{0%{transform:translate(-50%,20px);opacity:0}to{transform:translate(-50%);opacity:1}}.fab{position:fixed;bottom:calc(80px + env(safe-area-inset-bottom,0px));right:20px;z-index:96;display:inline-flex;align-items:center;gap:10px;padding:14px 22px 14px 18px;background:var(--primary);color:#fff;border:none;border-radius:999px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:0 8px 24px #5b6cff73;transition:transform .15s,box-shadow .15s,background .15s}.fab i{font-size:18px;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#ffffff2e}.fab .fab-label{white-space:nowrap}.fab:hover{background:var(--primary-2);transform:translateY(-2px);box-shadow:0 12px 28px #5b6cff8c}.fab:active{transform:translateY(0)}@media(max-width:480px){.fab{padding:14px}.fab .fab-label{display:none}.fab i{font-size:22px;width:28px;height:28px}}.dialog-overlay{position:fixed;inset:0;background:#0f172a8c;z-index:110;display:flex;align-items:center;justify-content:center;padding:20px;animation:overlayIn .2s ease-out}.dialog-overlay.dialog-overlay--front{z-index:400}.dialog-overlay.dialog-overlay--event-reminder{z-index:410}@media(max-width:640px){.dialog-overlay{padding:calc(env(safe-area-inset-top,0px) + 16px) 12px calc(env(safe-area-inset-bottom,0px) + 16px);align-items:flex-start}}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}.dialog{background:var(--surface);border-radius:20px;width:100%;max-width:560px;max-height:min(100vh - 40px,100dvh - 40px);overflow-y:auto;padding:24px;animation:dialogIn .25s cubic-bezier(.4,0,.2,1);box-shadow:0 20px 60px #0f172a40}@media(max-width:640px){.dialog{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 32px);border-radius:16px}}@keyframes dialogIn{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}.dialog-head h2{margin:4px 0 0;font-size:20px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}.dialog-head h2 i{color:var(--primary)}.dialog-close{background:#f1f3f7;border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;color:var(--muted);font-size:14px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,color .15s}.dialog-close:hover{background:var(--rose-soft);color:var(--rose)}.log-form{display:flex;flex-direction:column;gap:14px}.log-volume-field{margin:0}.log-volume-field .log-volume-input-row{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 10px;min-width:0}.log-volume-field .log-volume-input-row>input[type=number]{flex:0 0 118px;width:118px;max-width:min(118px,100%);min-width:0}.log-volume-field .predict-hint--inline{flex:1 1 auto;min-width:0;margin:0;padding:6px 10px;gap:6px;font-size:12px;border-radius:8px}.log-volume-field .predict-hint--inline>i{font-size:13px;flex-shrink:0}.log-volume-field .predict-hint--inline .hint-text{flex:1 1 auto;min-width:0;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.log-volume-field .predict-hint--inline .btn.small{flex-shrink:0;padding:4px 8px;font-size:11px}@media(max-width:400px){.log-volume-field .log-volume-input-row>input[type=number]{flex:1 1 100px;width:100%;max-width:none}.log-volume-field .predict-hint--inline{flex:1 1 100%;white-space:normal}.log-volume-field .predict-hint--inline .hint-text{white-space:normal;overflow:visible;text-overflow:unset}}.edit-date-banner{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 14px;background:linear-gradient(135deg,#eef2ff,#f5f3ff);border:1px solid #dbe1ff;border-radius:12px;font-size:13px;color:var(--text)}.edit-date-banner>i.pi-calendar{color:var(--primary, #5b6cff);font-size:15px}.edit-date-banner .edb-label{color:var(--muted, #6b7280);font-weight:500}.edit-date-banner .edb-value{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.edit-date-banner .edb-lock{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex-shrink:0;border-radius:50%;background:#ffffffe0;border:1px solid #e2e8f0;color:var(--muted, #64748b)}.edit-date-banner .edb-lock i{font-size:14px;line-height:1}.log-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.log-grid .field.full{grid-column:1/-1}.log-grid.log-grid--date-time{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:560px){.log-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:380px){.log-grid{grid-template-columns:1fr}}.quick-volumes{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.quick-volumes .quick-label{font-size:12px;color:var(--muted);font-weight:600;margin-right:4px}.quick-chip{padding:7px 13px;background:#f1f3f7;border:none;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer;color:var(--muted);transition:all .15s;font-family:inherit}.quick-chip:hover{background:var(--primary-soft);color:var(--primary)}.quick-chip.now-chip{background:var(--primary-soft);color:var(--primary);display:inline-flex;align-items:center;gap:4px}.quick-chip.now-chip:hover{background:var(--primary);color:#fff}.quick-chip.formula-chip{display:inline-flex;align-items:center;gap:5px;background:#fff7ed;color:#c2410c;border:1px solid #fed7aa}.quick-chip.formula-chip i{font-size:11px;opacity:.9}.quick-chip.formula-chip:hover{background:#ffedd5;color:#9a3412;border-color:#fdba74}.quick-chip.formula-chip.active{background:#c2410c;color:#fff;border-color:#c2410c;box-shadow:0 2px 8px #c2410c40}.quick-chip.formula-chip.active:hover{background:#9a3412;border-color:#9a3412;color:#fff}.bottle-prep{background:#f0f9ff;border:1px solid #bae6fd;border-radius:12px;padding:8px 12px;margin-bottom:16px;display:flex;flex-direction:column;gap:8px;transition:background .2s,border-color .2s}.bottle-prep:has(.bp-warning){background:#fffbeb;border-color:#fde68a}.bottle-prep:has(.bp-warning) .bp-info>i{color:#f59e0b}.bottle-prep:has(.bp-warning) .bp-info strong{color:#d97706}.bottle-prep:has(.bp-warning) .bp-prep-user{color:#92400e;background:#fbbf246b}.bottle-prep:has(.bp-warning) .bp-prep-time{color:#c2410c;background:linear-gradient(180deg,#fff7ed,#ffedd5);border-color:#fb923c73}.bottle-prep:has(.bp-form){align-items:stretch;padding:10px 12px 12px}.bottle-prep .bp-warning{display:flex;align-items:center;justify-content:space-between;gap:10px;animation:slideDown .2s ease;flex-wrap:wrap}.bottle-prep .bp-warning__content{display:flex;align-items:center;gap:8px;font-size:13px;flex:1;min-width:0}.bottle-prep .bp-warning__content i{font-size:16px;flex-shrink:0}.bottle-prep .bp-warning__content strong{font-weight:700}.bottle-prep .bp-warning--expired{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:8px 10px;color:#991b1b}.bottle-prep .bp-warning--expired i{color:#dc2626}.bottle-prep .bp-warning--soon{background:#fefce8;border:1px solid #fde68a;border-radius:8px;padding:8px 10px;color:#92400e}.bottle-prep .bp-warning--soon i{color:#f59e0b}.bottle-prep .bp-warning__btn{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;padding:7px 12px;font-size:12px;font-weight:700;font-family:inherit;color:#fff;background:linear-gradient(180deg,#f59e0b,#d97706);border:none;border-radius:8px;cursor:pointer;box-shadow:0 2px 4px #f59e0b40;transition:all .15s ease}.bottle-prep .bp-warning__btn i{font-size:12px}.bottle-prep .bp-warning__btn:hover{background:linear-gradient(180deg,#fbbf24,#f59e0b);transform:translateY(-1px);box-shadow:0 4px 8px #f59e0b59}.bottle-prep .bp-warning__btn:active{transform:translateY(0)}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.bottle-prep .bp-info-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.bottle-prep:not(:has(.bp-warning)):not(:has(.bp-form)){flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}.bottle-prep .bp-info{display:flex;align-items:flex-start;gap:8px;font-size:14px;color:var(--text);flex:1;min-width:0}.bottle-prep .bp-info>i{color:#0ea5e9;font-size:16px;margin-top:2px;flex-shrink:0}.bottle-prep .bp-info .bp-text{line-height:1.45;min-width:0}.bottle-prep .bp-info .bp-useby{display:inline-block;margin-top:2px;font-size:13px}.bottle-prep .bp-info strong{color:#0284c7;font-weight:800;font-variant-numeric:tabular-nums}.bottle-prep .bp-info .muted{color:var(--muted);font-size:13px}.bottle-prep .bp-actions{display:flex;gap:4px}.bottle-prep .bp-add{flex:1;background:transparent;border:none;padding:6px 4px;font-size:13px;font-weight:600;color:#0284c7;cursor:pointer;display:flex;align-items:center;gap:8px;font-family:inherit;text-align:left}.bottle-prep .bp-add>i{font-size:15px}.bottle-prep .bp-add:hover{color:#0369a1}.bottle-prep .bp-form{display:flex;flex-direction:column;gap:8px;width:100%}.bottle-prep .bp-form-head{display:flex;align-items:center;gap:6px}.bottle-prep .bp-form-head>i{color:#0ea5e9;font-size:15px}.bottle-prep .bp-form-head .bp-label{font-size:13px;color:var(--muted);font-weight:600;white-space:nowrap}.bottle-prep .bp-input-wrap{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #7dd3fc;border-radius:10px;padding:3px;transition:border-color .15s,box-shadow .15s}.bottle-prep .bp-input-wrap:focus-within{border-color:#0ea5e9;box-shadow:0 0 0 3px #0ea5e926}.bottle-prep .bp-input-wrap .bp-step{width:30px;height:30px;flex-shrink:0;border-radius:8px;border:none;background:#e0f2fe;color:#0369a1;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-family:inherit;transition:all .12s}.bottle-prep .bp-input-wrap .bp-step:hover{background:#bae6fd;color:#0284c7}.bottle-prep .bp-input-wrap .bp-step:active{transform:scale(.94)}.bottle-prep .bp-input-wrap .bp-step:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.bottle-prep .bp-input-wrap .bp-input{flex:1;min-width:60px;padding:4px 6px;font-size:18px;font-weight:800;border:none;background:transparent;font-variant-numeric:tabular-nums;font-family:inherit;color:#d97706;text-align:center;letter-spacing:-.01em}.bottle-prep .bp-input-wrap .bp-input:focus{outline:none}.bottle-prep .bp-input-wrap .bp-input:disabled{opacity:.55;cursor:not-allowed}.bottle-prep .bp-input-wrap .bp-unit{font-size:12px;color:var(--muted);font-weight:600;padding-right:4px}.bottle-prep .bp-quick{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.bottle-prep .bp-quick .bp-quick-label{font-size:11px;color:var(--muted);font-weight:600;margin-right:2px}.bottle-prep .bp-quick .bp-quick-chip{padding:4px 9px;background:#f0f9ff;border:1px solid #7dd3fc;border-radius:999px;font-size:11.5px;font-weight:700;color:#0369a1;cursor:pointer;font-family:inherit;font-variant-numeric:tabular-nums;transition:all .12s}.bottle-prep .bp-quick .bp-quick-chip:hover{background:#e0f2fe;border-color:#38bdf8;color:#0284c7}.bottle-prep .bp-quick .bp-quick-chip:active{transform:scale(.95)}.bottle-prep .bp-quick .bp-quick-chip:disabled{opacity:.45;cursor:not-allowed}.bottle-prep .bp-form-actions{display:flex;gap:6px;justify-content:flex-end}.bottle-prep .bp-btn{width:32px;height:32px;border-radius:8px;border:none;background:#fff;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:12px;transition:all .15s;flex-shrink:0}.bottle-prep .bp-btn:hover:not(:disabled){background:#e0f2fe;color:#0284c7}.bottle-prep .bp-btn:disabled{opacity:.45;cursor:not-allowed}.bottle-prep .bp-btn.primary{background:#0ea5e9;color:#fff}.bottle-prep .bp-btn.primary:hover:not(:disabled){background:#0284c7}.bottle-prep .bp-btn.danger:hover{background:var(--rose-soft);color:var(--rose)}.calc-block{border:1px solid #fde7c2;background:#fffaf0;border-radius:12px;overflow:hidden}.calc-block .calc-head{padding:10px 14px 0}.calc-block .prep-info{display:flex;align-items:flex-start;gap:6px;font-size:13px;color:var(--text)}.calc-block .prep-info>i{color:#f59e0b;font-size:14px;margin-top:2px;flex-shrink:0}.calc-block .prep-info .prep-info-text{line-height:1.45;min-width:0}.calc-block .prep-info strong{color:#d97706;font-weight:800;font-variant-numeric:tabular-nums}.calc-block .prep-info .muted{color:var(--muted-2);font-size:12px;display:inline-block;margin-top:2px}.calc-block .calc-body{padding:8px 14px 14px;display:flex;flex-direction:column;gap:10px}.calc-block .field.mini.remaining-input{position:relative;margin:0;display:flex;flex-direction:column}.calc-block .field.mini.remaining-input .label{font-size:11px;font-weight:600;color:var(--muted);margin-bottom:4px}.calc-block .field.mini.remaining-input input{width:100%;padding:10px 36px 10px 12px;font-size:16px;font-weight:700;border:1px solid #fadf9e;border-radius:8px;background:#fff;font-variant-numeric:tabular-nums;font-family:inherit;color:#d97706}.calc-block .field.mini.remaining-input input:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b26}.calc-block .field.mini.remaining-input .suffix{position:absolute;right:12px;top:50%;transform:translateY(4px);font-size:12px;color:var(--muted-2);pointer-events:none}.calc-block .calc-result-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.calc-block .calc-result{display:flex;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums}.calc-block .calc-result .calc-label{font-size:13px;color:var(--muted);font-weight:600}.calc-block .calc-result strong{font-size:22px;font-weight:800;color:var(--primary)}.calc-block .calc-result .u{font-size:12px;color:var(--primary);margin-left:2px}.calc-block .calc-result .muted{color:var(--muted-2);font-size:18px}.calc-block .calc-apply{flex-shrink:0}.calc-block .calc-apply:disabled{background:#e5e7eb;color:var(--muted-2);cursor:not-allowed;box-shadow:none}.predict-hint{display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(135deg,var(--primary-soft) 0%,var(--accent-soft) 100%);border-radius:10px;font-size:13px}.predict-hint>i{color:var(--primary);font-size:16px}.predict-hint .hint-text{flex:1;color:var(--text)}.predict-hint .hint-text strong{color:var(--primary);font-weight:700}.predict-hint.predict-hint--inline .hint-text strong{font-weight:800;font-variant-numeric:tabular-nums}.sync-error{padding:10px 14px;background:var(--rose-soft);color:#991b1b;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:6px}.sync-success{padding:10px 14px;background:var(--mint-soft);color:#166534;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:6px;animation:fadeIn .2s ease}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}.feeding-settings-dialog .feeding-settings-hint{margin:0 0 14px;font-size:13px;line-height:1.45}.feeding-settings-dialog .feeding-settings-hint code{font-size:11px;padding:1px 5px;border-radius:4px;background:#f1f5f9}.feeding-settings-dialog .feeding-settings-grid{grid-template-columns:1fr;gap:16px}.feeding-settings-dialog .field-hint{display:block;margin-top:8px;font-size:12px;line-height:1.4;padding:8px 12px;background:#f8fafc;border-radius:8px;border-left:3px solid #e2e8f0}.feeding-settings-dialog .label{position:relative}.feeding-settings-dialog .label code{font-size:11px;font-weight:600;color:var(--primary);background:var(--primary-soft);padding:2px 6px;border-radius:4px}.feeding-settings-dialog .label .notification-badge{display:inline-flex;align-items:center;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff;background:linear-gradient(135deg,#10b981,#059669);padding:2px 6px;border-radius:10px;margin-left:6px;box-shadow:0 1px 2px #10b98133;animation:gentle-pulse 2s ease-in-out infinite}.feeding-settings-dialog .notification-setting-field{position:relative}.feeding-settings-dialog .notification-setting-field input{border:1.5px solid #10b981;background:linear-gradient(to right,#fff,#f0fdf4)}.feeding-settings-dialog .notification-setting-field input:focus{border-color:#059669;box-shadow:0 0 0 3px #10b9811a;background:#fff}.feeding-settings-dialog .notification-setting-field input::placeholder{color:#6b7280;opacity:.7}.feeding-settings-dialog .notification-setting-field .field-hint{border-left-color:#10b981;background:linear-gradient(to right,#f0fdf4,#f8fafc)}@keyframes gentle-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.02)}}.log-time--with-badge,.feed-row-time .time--with-badge{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}.log-merge-badge,.feed-merge-badge{font:inherit;font-size:10px;font-weight:700;padding:2px 7px;border-radius:999px;border:1px solid rgba(99,102,241,.35);background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#312e81;cursor:pointer;line-height:1.2;white-space:nowrap}.log-merge-badge:hover,.feed-merge-badge:hover{filter:brightness(1.03)}.log-row--clickable,.feed-row--clickable{cursor:pointer}.log-row--clickable:hover,.feed-row--clickable:hover{background:#6366f10f}.log-row--clickable:focus-visible,.feed-row--clickable:focus-visible{outline:2px solid rgba(99,102,241,.45);outline-offset:2px}.dialog-overlay.dialog-overlay--front.feed-group-detail-overlay{z-index:125}.dialog-overlay.dialog-overlay--front.feed-detail-overlay{z-index:140;animation:overlayIn .12s ease-out}.dialog-overlay.dialog-overlay--front.feed-detail-overlay .feed-detail-dialog{animation:feedDetailIn .14s ease-out}@keyframes feedDetailIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.feed-detail-dialog{--fd-accent: 99, 102, 241;--fd-soft: #eef2ff;--fd-strong: #4338ca;max-width:min(400px,96vw);padding:0;overflow:hidden;display:flex;flex-direction:column}.feed-detail-dialog[data-status=low]{--fd-accent: 245, 158, 11;--fd-soft: #fffbeb;--fd-strong: #b45309}.feed-detail-dialog[data-status=high]{--fd-accent: 244, 63, 94;--fd-soft: #fff1f2;--fd-strong: #e11d48}.feed-detail-dialog[data-status=ok]{--fd-accent: 16, 185, 129;--fd-soft: #ecfdf5;--fd-strong: #059669}.feed-detail-top{position:relative;padding:20px 20px 16px;text-align:center;background:radial-gradient(120% 80% at 50% -20%,rgba(var(--fd-accent),.22),transparent 55%),linear-gradient(180deg,var(--fd-soft) 0%,#ffffff 72%);border-bottom:1px solid rgba(var(--fd-accent),.12)}.feed-detail-close{position:absolute;top:12px;right:12px;width:36px;height:36px;border:none;border-radius:50%;background:#ffffffd9;color:#64748b;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px #0f172a14;transition:background .15s ease,color .15s ease}.feed-detail-close:hover{background:#fff;color:#0f172a}.feed-detail-eyebrow{margin:0 0 6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b}.feed-detail-metric{display:flex;align-items:flex-end;justify-content:center;gap:4px;line-height:1;margin-bottom:10px}.feed-detail-metric__value{font-size:clamp(48px,14vw,56px);font-weight:800;letter-spacing:-.04em;color:var(--fd-strong);font-variant-numeric:tabular-nums}.feed-detail-metric__unit{font-size:18px;font-weight:700;color:rgba(var(--fd-accent),.85);padding-bottom:8px}.feed-detail-status{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700;background:#fff;border:1px solid rgba(var(--fd-accent),.28);color:var(--fd-strong);box-shadow:0 2px 6px rgba(var(--fd-accent),.1)}.feed-detail-status .pi{font-size:13px}.feed-detail-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px}.feed-detail-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:12px;background:#ffffffeb;border:1px solid #e2e8f0;font-size:12px;font-weight:600;color:#334155;line-height:1.3;box-shadow:0 1px 4px #0f172a0a}.feed-detail-chip .pi{font-size:13px;color:#6366f1;flex-shrink:0}.feed-detail-chip em{font-style:normal;font-weight:500;color:#94a3b8;margin-left:4px}.feed-detail-chip--time .pi{color:#dc2626}.feed-detail-chip--time span{font-variant-numeric:tabular-nums;font-weight:700;color:#dc2626}.feed-detail-chip--muted{background:#f8fafc;border-color:#e2e8f0;color:#64748b;font-weight:500}.feed-detail-chip--muted .pi{color:#94a3b8}.feed-detail-body{padding:16px 18px 8px;overflow-y:auto;flex:1;min-height:0}.feed-detail-section{margin-bottom:14px}.feed-detail-section:last-child{margin-bottom:0}.feed-detail-section__title{margin:0 0 10px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;display:flex;align-items:center;gap:7px}.feed-detail-section__title .pi{font-size:13px;color:#6366f1}.feed-detail-cards{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.feed-detail-card{display:flex;align-items:flex-start;gap:12px;padding:12px 13px;border-radius:14px;background:linear-gradient(180deg,#fafbff,#fff);border:1px solid #e2e8f0;box-shadow:0 2px 8px #0f172a0a}.feed-detail-card--warn,.feed-detail-card--gap.feed-detail-card--warn{border-color:#f59e0b66;background:linear-gradient(180deg,#fffbeb,#fff)}.feed-detail-card--warn .feed-detail-card__icon,.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__icon{background:#fef3c7;color:#b45309}.feed-detail-card--warn .feed-detail-card__text,.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__text{color:#92400e}.feed-detail-card--position{border-color:#8b5cf659;background:linear-gradient(180deg,#f5f3ff,#fff)}.feed-detail-card--average{border-color:#0ea5e959;background:linear-gradient(180deg,#f0f9ff,#fff)}.feed-detail-card--next{border-color:#10b98159;background:linear-gradient(180deg,#ecfdf5,#fff)}.feed-detail-card--gap:not(.feed-detail-card--warn){border-color:#64748b59;background:linear-gradient(180deg,#f8fafc,#fff)}.feed-detail-card__icon{flex-shrink:0;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#eef2ff;color:#4f46e5;font-size:15px}.feed-detail-card__icon[data-kind=position]{background:#ede9fe;color:#7c3aed}.feed-detail-card__icon[data-kind=average]{background:#e0f2fe;color:#0284c7}.feed-detail-card__icon[data-kind=next]{background:#d1fae5;color:#059669}.feed-detail-card__icon[data-kind=gap]{background:#e2e8f0;color:#475569}.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__icon{background:#fef3c7;color:#b45309}.feed-detail-card__body{min-width:0;flex:1}.feed-detail-card__label{display:block;font-size:11px;font-weight:800;color:#64748b;margin-bottom:3px;letter-spacing:.02em}.feed-detail-card__text{margin:0;font-size:13px;line-height:1.5;color:#0f172a}.fdc-position__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin-bottom:8px}.fdc-position__idx{font-size:18px;font-weight:800;color:#6d28d9;letter-spacing:-.02em}.fdc-position__of{font-size:14px;font-weight:700;color:#a78bfa}.fdc-position__tag{font-size:11px;font-weight:600;color:#64748b;padding:2px 8px;border-radius:999px;background:#8b5cf61a}.fdc-progress{height:8px;border-radius:999px;background:#ede9fe;overflow:hidden;margin-bottom:10px}.fdc-progress__fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#8b5cf6,#6366f1);transition:width .2s ease}.fdc-position__stats{display:flex;flex-wrap:wrap;gap:8px}.fdc-stat{display:inline-flex;align-items:baseline;gap:4px;padding:6px 10px;border-radius:10px;font-size:12px}.fdc-stat strong{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}.fdc-stat small{font-size:11px;font-weight:600;opacity:.85}.fdc-stat--violet{background:#f5f3ff;color:#5b21b6}.fdc-stat--violet strong{color:#6d28d9}.fdc-stat--indigo{background:#eef2ff;color:#4338ca}.fdc-stat--indigo strong{color:#4f46e5}.fdc-avg,.fdc-next{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}.fdc-pill{display:inline-flex;padding:4px 10px;border-radius:999px;font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}.fdc-pill--up{background:#dcfce7;color:#15803d}.fdc-pill--down{background:#fee2e2;color:#b91c1c}.fdc-pill--neutral{background:#f1f5f9;color:#475569}.fdc-avg__meta{font-size:12px;color:#64748b;line-height:1.4}.fdc-avg__meta strong{color:#0f172a;font-weight:700}.fdc-next__time{font-size:16px;font-weight:800;color:#dc2626;font-variant-numeric:tabular-nums}.fdc-next__vol{font-size:14px;font-weight:800;color:#059669;padding:4px 10px;border-radius:8px;background:#d1fae5}.fdc-next__gap{font-size:12px;font-weight:600;color:#64748b;display:inline-flex;align-items:center;gap:4px}.fdc-gap{display:flex;flex-direction:column;gap:10px}.fdc-gap__prev{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;padding:10px 12px;border-radius:10px;background:#ffffffe6;border:1px solid #e2e8f0}.fdc-gap__prev-label{font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;width:100%}.fdc-gap__prev-time{font-size:17px;font-weight:800;color:#0f172a;font-variant-numeric:tabular-nums}.fdc-gap__prev-vol{font-size:14px;font-weight:800;color:#475569;padding:3px 8px;border-radius:8px;background:#f1f5f9}.fdc-gap__prev-date{font-size:11px;font-weight:600;color:#94a3b8}.fdc-gap__row{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;min-width:0}.fdc-gap__interval{display:inline-flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;color:#475569;background:#e2e8f0;white-space:nowrap}.fdc-gap__interval .pi{font-size:13px;flex-shrink:0}.fdc-gap__interval span{overflow:hidden;text-overflow:ellipsis}.fdc-gap__interval--warn{color:#b45309;background:#fde68a;border:1px solid rgba(245,158,11,.35)}.fdc-gap__vol-diff{flex:0 0 auto;white-space:nowrap;font-size:12px;padding:5px 10px}.feed-detail-quote{margin:0;padding:12px 14px 12px 16px;border-radius:0;border-left:3px solid #c7d2fe;background:#f8fafc;font-size:14px;line-height:1.55;color:#334155;font-style:normal}.feed-detail-footer{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid #e2e8f0;background:#fafbff}.feed-detail-cta{display:flex;gap:8px;justify-content:stretch}.feed-detail-cta .btn{flex:1;justify-content:center}.feed-detail-cta .btn.primary{flex:1.2}.feed-group-detail-dialog .feed-group-detail-summary{margin:0 0 8px;padding:0 2px;font-size:13px;line-height:1.45}.feed-group-detail-dialog .feed-group-detail-hint{margin:0 0 12px;font-size:12px;line-height:1.4;display:flex;align-items:center;gap:6px}.feed-group-detail-dialog .feed-group-detail-history{margin-bottom:4px}.feed-group-detail-dialog .feed-group-detail-rows{max-height:min(58vh,420px);overflow-y:auto;padding-right:2px}.mom-food-card{--mf-tone: 244, 114, 182;--mf-soft: #fdf2f8;--mf-ring: #fbcfe8;--mf-strong: #db2777;position:relative;overflow:hidden;background:radial-gradient(900px 260px at 0% 0%,rgba(var(--mf-tone),.14),transparent 60%),#fff;border-color:rgba(var(--mf-tone),.22);padding:18px;margin-top:16px}.mom-food-card[data-accent=rose]{--mf-tone: 244, 63, 94;--mf-soft: #fff1f2;--mf-ring: #fecdd3;--mf-strong: #e11d48}.mom-food-card[data-accent=peach]{--mf-tone: 251, 146, 60;--mf-soft: #fff7ed;--mf-ring: #fed7aa;--mf-strong: #ea580c}.mom-food-card[data-accent=mint]{--mf-tone: 16, 185, 129;--mf-soft: #ecfdf5;--mf-ring: #a7f3d0;--mf-strong: #059669}.mom-food-card[data-accent=lavender]{--mf-tone: 139, 92, 246;--mf-soft: #f5f3ff;--mf-ring: #ddd6fe;--mf-strong: #7c3aed}.mom-food-card[data-accent=amber]{--mf-tone: 245, 158, 11;--mf-soft: #fffbeb;--mf-ring: #fde68a;--mf-strong: #d97706}.mf-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.mf-head__lead{min-width:0;flex:1}.mf-head .eyebrow{display:inline-flex;align-items:center;gap:6px;color:var(--mf-strong);font-weight:700}.mf-head .eyebrow i{font-size:13px}.mf-head h2{margin:4px 0 0;font-size:18px;font-weight:800;color:var(--text);line-height:1.25}.mf-headline{margin:4px 0 0;font-size:13px;color:var(--mf-strong);font-weight:600}.mf-nav{display:inline-flex;align-items:center;gap:6px;background:var(--mf-soft);border-radius:999px;padding:4px;border:1px solid rgba(var(--mf-tone),.25);flex-shrink:0}.mf-arrow{width:30px;height:30px;border-radius:50%;border:none;background:#fff;color:var(--mf-strong);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease,background .15s ease}.mf-arrow i{font-size:12px}.mf-arrow:hover:not(:disabled){transform:scale(1.08);background:var(--mf-strong);color:#fff}.mf-arrow:disabled{opacity:.35;cursor:not-allowed}.mf-step{font-variant-numeric:tabular-nums;font-size:12px;color:var(--muted);padding:0 4px}.mf-step strong{color:var(--mf-strong);font-weight:800;font-size:13px}.mf-reset{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--mf-strong);background:transparent;border:1px dashed rgba(var(--mf-tone),.5);border-radius:999px;padding:4px 12px;cursor:pointer;margin-bottom:10px;transition:background .15s ease}.mf-reset:hover{background:var(--mf-soft)}.mf-reset i{font-size:11px}.mf-desc{margin:0 0 14px;font-size:13px;color:var(--muted);line-height:1.55}.mf-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}@media(max-width:640px){.mf-columns{grid-template-columns:1fr}}.mf-col{padding:12px 14px;border-radius:14px;background:#fff;border:1px solid #eef0f3}.mf-col--good{background:linear-gradient(180deg,#f0fdf4,#fff 80%);border-color:#bbf7d0}.mf-col--bad{background:linear-gradient(180deg,#fef2f2,#fff 80%);border-color:#fecaca}.mf-col-title{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:14px;font-weight:800;color:var(--text);letter-spacing:.01em}.mf-dot{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;flex-shrink:0;font-size:11px}.mf-dot i{font-size:10px}.mf-dot.good{background:#10b981;box-shadow:0 2px 6px #10b9814d}.mf-dot.bad{background:#ef4444;box-shadow:0 2px 6px #ef44444d}.mf-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.mf-item{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:10px;background:#ffffffb3;transition:background .15s ease,transform .15s ease}.mf-item:hover{background:#fff;transform:translate(2px)}.mf-item--bad .mf-name{color:#7f1d1d}.mf-item--good .mf-name{color:#064e3b}.mf-emoji{width:28px;height:28px;border-radius:8px;background:#fff;display:inline-grid;place-items:center;font-size:16px;flex-shrink:0;box-shadow:0 1px 2px #0f172a0f}.mf-emoji--x{background:#fef2f2;color:#ef4444}.mf-emoji--x i{font-size:12px}.mf-item-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.mf-name{font-size:13px;font-weight:700;color:var(--text);line-height:1.3}.mf-note{font-size:11.5px;color:var(--muted);line-height:1.35}.mf-tip{display:flex;align-items:flex-start;gap:8px;padding:10px 14px;border-radius:12px;background:var(--mf-soft);border:1px solid rgba(var(--mf-tone),.22);font-size:12.5px;color:var(--text);line-height:1.5}.mf-tip i{color:var(--mf-strong);font-size:15px;margin-top:1px;flex-shrink:0}.mom-tab .card{padding:12px 14px;margin-bottom:10px;border-radius:14px}.mom-tab .mom-wellness-section,.mom-tab .mom-tips-week{margin-bottom:10px}.mom-tab .mom-food-card{padding:12px 14px;margin-top:10px}.mom-tab .mf-head{margin-bottom:8px}.mom-tab .mf-head h2{font-size:16px}.mom-tab .mf-desc{margin-bottom:10px;font-size:12px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.mom-tab .mf-columns{gap:8px;margin-bottom:8px}.mom-tab .mf-col{padding:8px 10px}.mom-tab .mf-list{gap:6px}.mom-tab .mf-item{padding:6px 8px}.mom-tab .mf-tip{padding:8px 10px;font-size:12px}.mom-hero{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;margin-bottom:14px;background:linear-gradient(135deg,#fdf2f8,#faf5ff,#eef2ff);border:1px solid #f9a8d4;border-radius:16px}.mom-hero .mom-hero__icon{font-size:36px;line-height:1;flex-shrink:0}.mom-hero h2{margin:0 0 6px;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.02em}.mom-hero .mom-hero__sub{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}.mom-hero .mom-hero__sub strong{color:var(--text)}.mom-hero .mom-hero__sub .muted-inline{display:block;margin-top:4px;font-size:12.5px;opacity:.92}.mom-hero--compact{align-items:center;padding:10px 12px;margin-bottom:10px;border-radius:14px;gap:10px}.mom-hero--compact .mom-hero__icon{font-size:26px}.mom-hero--compact h2{margin:0;font-size:16px;letter-spacing:-.01em}.mom-hero--compact .mom-hero__title-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px}.mom-hero--compact .mom-hero__baby{font-size:12px;font-weight:700;color:#be185d;padding:2px 8px;border-radius:999px;background:#ffffffbf;border:1px solid rgba(244,114,182,.35)}.mom-hero--compact .mom-hero__sub{margin:4px 0 0;font-size:11.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mom-hero--compact .mom-hero__sub .muted-inline{display:inline;margin-top:0;font-size:11.5px}.section-head--tight{margin-bottom:8px}.section-head--tight h3{margin:0}.mom-disclaimer--compact{font-size:11px;line-height:1.4;padding:8px 10px;margin-top:4px;margin-bottom:6px}.section-head{margin-bottom:14px}.section-head h3{margin:0 0 6px;font-size:16px;font-weight:800;display:flex;align-items:center;gap:8px;color:var(--text)}.section-head h3 i{color:#db2777;font-size:15px}.section-head .section-sub{margin:0;font-size:12.5px;color:var(--muted);line-height:1.45}.mom-wellness-section{margin-bottom:16px}.mom-tab .mom-wellness-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}.mom-wellness-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.mom-w-card{padding:14px 14px 12px;border-radius:14px;border:1px solid var(--border);background:#fafafa;transition:border-color .15s,box-shadow .15s}.mom-w-card:hover{border-color:#f472b6;box-shadow:0 6px 18px -12px #db277759}.mom-w-card .mom-w-card__icon{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#fce7f3,#ede9fe);display:flex;align-items:center;justify-content:center;margin-bottom:10px}.mom-w-card .mom-w-card__icon i{font-size:16px;color:#be185d}.mom-w-card h4{margin:0 0 8px;font-size:13.5px;font-weight:800;color:var(--text);line-height:1.3}.mom-w-card p{margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}.mom-tips-week{margin-bottom:16px}.mom-tab .mom-tips-list{gap:6px}.mom-tab .mom-tips-list li{padding:8px 10px;border-radius:10px}.mom-tab .mom-tips-list li strong{margin-bottom:2px;font-size:12px}.mom-tab .mom-tips-list li span{font-size:11.5px;line-height:1.4}.mom-tips-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.mom-tips-list li{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:#fefce8;border:1px solid #fde047}.mom-tips-list li>i{color:#ca8a04;margin-top:2px;flex-shrink:0}.mom-tips-list li strong{display:block;font-size:13px;font-weight:800;color:var(--text);margin-bottom:4px}.mom-tips-list li span{font-size:12.5px;line-height:1.5;color:var(--muted)}.mom-disclaimer{margin-top:8px;margin-bottom:8px}.mom-empty-profile{max-width:520px;margin:24px auto 40px;text-align:center}.mom-empty-profile__inner{padding:28px 22px}.mom-empty-profile__inner .mom-empty-emoji{font-size:48px;display:block;margin-bottom:12px}.mom-empty-profile__inner h2{margin:0 0 10px;font-size:17px;font-weight:800;color:var(--text)}.mom-empty-profile__inner p{margin:0 0 18px;font-size:14px;line-height:1.55;color:var(--muted)}.event-reminder-dialog{max-width:min(520px,100vw - 28px);padding-bottom:8px}.event-reminder-dialog__head{align-items:flex-start;margin-bottom:4px}.event-reminder-dialog__title{margin:0;padding-right:40px;font-size:20px;font-weight:800;line-height:1.3;color:var(--text, #0f172a);display:flex;align-items:center;gap:10px;letter-spacing:-.02em}.event-reminder-dialog__title .pi-bell{color:#f59e0b;font-size:18px;flex-shrink:0}.event-reminder-list{list-style:none;margin:12px 0 0;padding:0;max-height:min(52vh,400px);overflow:auto;display:flex;flex-direction:column;gap:10px}.event-reminder-card{padding:14px 16px;background:linear-gradient(180deg,#fafbff,#fff);border:1px solid #e2e8f0;border-radius:14px;box-shadow:0 2px 8px #0f172a0d}.event-reminder-card__title{margin:0;font-size:16px;font-weight:800;color:var(--text, #0f172a);line-height:1.35}.event-reminder-card__datetime{margin:5px 0 0;font-size:12.5px;font-weight:500;color:#64748b;line-height:1.4}.event-reminder-card__date{color:#475569;font-weight:600}.event-reminder-card__sep{color:#94a3b8}.event-reminder-card__hour{color:#dc2626;font-weight:700;font-variant-numeric:tabular-nums}.event-reminder-card__place{margin:6px 0 0;display:flex;align-items:flex-start;gap:6px;font-size:13px;color:#475569;line-height:1.4}.event-reminder-card__place .pi-map-marker{margin-top:2px;flex-shrink:0;font-size:13px;color:var(--primary, #5b6cff)}.event-reminder-card__content-wrap{margin-top:10px;padding-top:10px;border-top:1px solid #eef1f6}.event-reminder-card__content-label{display:block;margin-bottom:4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8}.event-reminder-card__content{margin:0;font-size:13.5px;color:#334155;line-height:1.5;white-space:pre-wrap}.event-reminder-actions{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border, #e5e7eb)}.event-reminder-actions__link{flex:0 1 auto;min-width:0;padding:6px 4px;border:none;background:transparent;color:#64748b;font-size:13px;font-weight:600;font-family:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.event-reminder-actions__link:hover:not(:disabled){color:#334155}.event-reminder-actions__link:disabled{opacity:.5;cursor:not-allowed}.event-reminder-actions__primary{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;font-size:15px;font-weight:700;text-align:center}\n"] }]
|
|
15844
|
+
NotificationListComponent,
|
|
15845
|
+
SubrouteShellComponent,
|
|
15846
|
+
SettingsMenuComponent,
|
|
15847
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"feeding-root\">\n <div class=\"feeding-page\" #feedingPage>\n <div class=\"backdrop\"></div>\n\n <header class=\"hero\" [class.hero--profile-merged]=\"profile() && !editing() && ageBreakdown()\">\n @if (profile() && !editing() && ageBreakdown(); as age) {\n <!-- \u2550\u2550 REDESIGNED HERO \u2550\u2550 -->\n <app-hero-header\n [profile]=\"profile()!\"\n [age]=\"age\"\n [user]=\"user()\"\n [weightLabel]=\"profileHeroWeightLabel()\"\n [isAnyLoading]=\"isAnyLoading()\"\n [showRefresh]=\"bottomTab() !== 'schedule'\"\n (openMenu)=\"openSettingsMenu()\"\n (refresh)=\"refreshAll()\"\n >\n <app-activity-log slot=\"activity-log\" (activityChanged)=\"onActivityChanged()\"></app-activity-log>\n </app-hero-header>\n\n <app-hero-stats-strip\n [currentTime]=\"currentTimeStr\"\n [dateLabel]=\"heroDateLabel\"\n [nextFeedTime]=\"prediction()?.nextTime ?? null\"\n [nextFeedCountdown]=\"heroNextFeedCountdown()\"\n [weightLabel]=\"profileHeroWeightLabel()\"\n [whoStatus]=\"nutritionTarget()?.ageLabel ?? null\"\n ></app-hero-stats-strip>\n\n <div class=\"hero-notif-wrap\">\n <app-notification-banner\n [notifications]=\"visibleNotifications()\"\n [saving]=\"notificationSaving()\"\n [currentUser]=\"user()\"\n [dialogOpen]=\"notifDialogOpen()\"\n (openDialog)=\"openNotificationRoute()\"\n (closeDialog)=\"notifDialogOpen.set(false)\"\n (acknowledge)=\"acknowledgeNotification($event)\"\n (acknowledgeAll)=\"notifDialogOpen.set(false); openAcknowledgeAllConfirmDialog()\"\n (delete)=\"deleteNotification($event)\"\n (openComposer)=\"notifDialogOpen.set(false); openNotificationComposerDialog()\"\n ></app-notification-banner>\n </div>\n\n } @else {\n <!-- \u2500\u2500 Fallback: no profile / editing \u2500\u2500 -->\n <div class=\"hero-inner\">\n <div class=\"hero-brand\">\n <div class=\"hero-title-row\">\n <div class=\"hero-title\">\n <div class=\"emoji\" aria-hidden=\"true\">\uD83D\uDC76</div>\n <div class=\"hero-text\">\n <h1>B\u00E9 y\u00EAu c\u1EE7a b\u1EA1n</h1>\n <p class=\"hero-userline\">\n <i class=\"pi pi-user\" aria-hidden=\"true\"></i>\n <strong>{{ user() }}</strong>\n </p>\n </div>\n </div>\n @if (profile() && !editing()) {\n <div class=\"hero-actions\">\n <app-activity-log (activityChanged)=\"onActivityChanged()\"></app-activity-log>\n <button\n class=\"btn icon-btn\"\n type=\"button\"\n (click)=\"feedingDialogs.openFeedingSettingsDialog()\"\n title=\"C\u00E0i \u0111\u1EB7t\"\n aria-label=\"C\u00E0i \u0111\u1EB7t c\u1EEF b\u00FA\"\n >\n <i class=\"pi pi-sliders-h\"></i>\n </button>\n @if (bottomTab() !== 'schedule') {\n <button\n class=\"btn icon-btn\"\n type=\"button\"\n (click)=\"refreshAll()\"\n [disabled]=\"isAnyLoading()\"\n [title]=\"\n isAnyLoading() ? '\u0110ang t\u1EA3i\u2026' : 'T\u1EA3i l\u1EA1i C\u1EEF b\u00FA, C\u00E2n, L\u1ECBch, Y t\u1EBF, T\u00E0i li\u1EC7u'\n \"\n aria-label=\"T\u1EA3i l\u1EA1i C\u1EEF b\u00FA, Th\u1EC3 tr\u1EA1ng, L\u1ECBch, Ti\u1EC1n s\u1EED y t\u1EBF v\u00E0 T\u00E0i li\u1EC7u\"\n >\n <i class=\"pi pi-refresh\" [class.spin]=\"isAnyLoading()\"></i>\n </button>\n }\n </div>\n }\n </div>\n </div>\n\n <div class=\"hero-datetime\" aria-live=\"polite\">\n <div class=\"hero-datetime-strip\">\n <div class=\"hero-datetime-strip__block hero-datetime-strip__block--date\">\n <i class=\"pi pi-calendar\" aria-hidden=\"true\"></i>\n <span class=\"hero-datetime-strip__wd\">{{ heroWeekday }}</span>\n <time class=\"hero-datetime-strip__date\" [attr.datetime]=\"todayDateStr()\">{{\n heroDateNumeric\n }}</time>\n </div>\n <span class=\"hero-datetime-strip__divider\" aria-hidden=\"true\"></span>\n <div class=\"hero-datetime-strip__block hero-datetime-strip__block--time\">\n <i class=\"pi pi-clock\" aria-hidden=\"true\"></i>\n <span class=\"hero-datetime-strip__clock\">{{ currentTimeStr }}</span>\n </div>\n </div>\n </div>\n\n <section class=\"hero-notification\" aria-label=\"Th\u00F4ng b\u00E1o n\u1ED9i b\u1ED9\">\n <!-- watermark background icons -->\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-bell\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-megaphone\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-comments\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--send\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-send\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--star\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-star\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--bolt\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-bolt\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--heart\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-heart\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--info\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-info-circle\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--check\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-check-circle\"></i>\n </span>\n <span\n class=\"hero-notification__bg-icon hero-notification__bg-icon--eye\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-eye\"></i>\n </span>\n\n <div class=\"hero-notification__head\">\n <label class=\"hero-notification__composer-label\" for=\"hero-notification-input\">\n <i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i>\n <span>Th\u00F4ng b\u00E1o</span>\n @if (visibleNotifications().length > 0) {\n <span class=\"hero-notification__unread-badge\">{{\n visibleNotifications().length\n }}</span>\n }\n </label>\n <div class=\"hero-notification__head-actions\">\n <button\n type=\"button\"\n class=\"hero-notification__mark-all\"\n (click)=\"openAcknowledgeAllConfirmDialog()\"\n [disabled]=\"notificationSaving() || visibleNotifications().length === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i>\n \u0110\u00E3 \u0111\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button\n type=\"button\"\n class=\"hero-notification__add\"\n (click)=\"openNotificationComposerDialog()\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n title=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n\n @if (displayedNotifications().length > 0) {\n <ul class=\"hero-notification__list\">\n @for (notice of displayedNotifications(); track notice) {\n <li class=\"hero-notification__item\">\n <div class=\"hero-notification__avatar\" aria-hidden=\"true\">\n {{ notice.user | slice: 0 : 2 | uppercase }}\n </div>\n <div class=\"hero-notification__body\">\n <div class=\"hero-notification__body-head\">\n <span class=\"hero-notification__author\">{{ notice.user }}</span>\n </div>\n <p class=\"hero-notification__content\">{{ notice.content }}</p>\n @if (notice.createdAt) {\n <span class=\"hero-notification__created\">{{\n formatNotificationCreatedAt(notice.createdAt)\n }}</span>\n }\n </div>\n <div class=\"hero-notification__item-actions\">\n <button\n type=\"button\"\n class=\"hero-notification__ack-top\"\n (click)=\"acknowledgeNotification(notice)\"\n [disabled]=\"notificationSaving()\"\n aria-label=\"\u0110\u00E3 \u0111\u1ECDc th\u00F4ng b\u00E1o\"\n title=\"\u0110\u00E3 \u0111\u1ECDc\"\n >\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDeleteNotification(notice)) {\n <button\n type=\"button\"\n class=\"hero-notification__delete\"\n (click)=\"deleteNotification(notice)\"\n [disabled]=\"notificationSaving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\"\n title=\"X\u00F3a th\u00F4ng b\u00E1o\"\n >\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </li>\n }\n </ul>\n } @else {\n <div class=\"hero-notification__empty\">\n <i class=\"pi pi-bell hero-notification__empty-icon\" aria-hidden=\"true\"></i>\n <span class=\"hero-notification__empty-title\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n <span class=\"hero-notification__empty-sub\"\n >M\u1ECDi th\u1EE9 \u0111\u1EC1u \u1ED5n. Th\u00F4ng b\u00E1o m\u1EDBi s\u1EBD xu\u1EA5t hi\u1EC7n \u1EDF \u0111\u00E2y.</span\n >\n </div>\n }\n\n @if (hiddenNotificationCount() > 0) {\n <button\n type=\"button\"\n class=\"hero-notification__more\"\n (click)=\"openNotificationListDialog()\"\n >\n Xem th\u00EAm {{ hiddenNotificationCount() }} th\u00F4ng b\u00E1o \u2192\n </button>\n }\n </section>\n\n </div>\n } <!-- end @else no-profile -->\n </header>\n\n <!-- \u2550\u2550 NOTIFICATION DIALOGS \u2014 rendered outside <header> to avoid overflow/stacking-context clipping \u2550\u2550 -->\n @if (notificationComposerDialogOpen()) {\n <div\n class=\"dialog-overlay dialog-overlay--front\"\n (click)=\"closeNotificationComposerDialog()\"\n >\n <div\n class=\"dialog hero-notification-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label=\"T\u1EA1o th\u00F4ng b\u00E1o\"\n (click)=\"$event.stopPropagation()\"\n >\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\" aria-hidden=\"true\"><i class=\"pi pi-bell\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\" aria-hidden=\"true\"><i class=\"pi pi-megaphone\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--send\" aria-hidden=\"true\"><i class=\"pi pi-send\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--star\" aria-hidden=\"true\"><i class=\"pi pi-star\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\" aria-hidden=\"true\"><i class=\"pi pi-comments\"></i></span>\n\n <div class=\"dialog-head hero-notification-dialog__head\">\n <div class=\"hero-notification-dialog__title-group\">\n <div class=\"hero-notification-dialog__icon-wrap\">\n <i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i>\n </div>\n <div>\n <h2 class=\"hero-notification-dialog__title\">T\u1EA1o th\u00F4ng b\u00E1o</h2>\n <p class=\"hero-notification-dialog__subtitle\">Th\u00F4ng b\u00E1o s\u1EBD hi\u1EC3n th\u1ECB cho to\u00E0n b\u1ED9 th\u00E0nh vi\u00EAn</p>\n </div>\n </div>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeNotificationComposerDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <div class=\"hero-notification__composer-panel\">\n <div class=\"hero-notification__composer-row\">\n <div class=\"hero-notification__input-wrap\">\n <textarea\n id=\"hero-notification-input\"\n class=\"hero-notification__input\"\n [value]=\"notificationDraft()\"\n (input)=\"updateNotificationDraft($any($event.target).value)\"\n [disabled]=\"notificationSaving()\"\n maxlength=\"300\"\n placeholder=\"Nh\u1EADp n\u1ED9i dung th\u00F4ng b\u00E1o cho m\u1ECDi ng\u01B0\u1EDDi...\"\n aria-label=\"N\u1ED9i dung th\u00F4ng b\u00E1o\"\n ></textarea>\n <div class=\"hero-notification__char-ring\" aria-hidden=\"true\">\n <svg viewBox=\"0 0 36 36\">\n <circle class=\"hero-notification__char-ring-track\" cx=\"18\" cy=\"18\" r=\"15\" />\n <circle class=\"hero-notification__char-ring-fill\" cx=\"18\" cy=\"18\" r=\"15\"\n [style.stroke-dashoffset]=\"94 - (notificationDraft().trim().length / 300) * 94\" />\n </svg>\n <span class=\"hero-notification__char-count\">{{ notificationDraft().trim().length }}</span>\n </div>\n </div>\n </div>\n <div class=\"hero-notification__composer-actions\">\n <button type=\"button\" class=\"btn ghost hero-notification__cancel\"\n (click)=\"closeNotificationComposerDialog()\" [disabled]=\"notificationSaving()\">H\u1EE7y</button>\n <button type=\"button\" class=\"btn hero-notification__send\"\n (click)=\"createNotification()\"\n [disabled]=\"notificationSaving() || !notificationDraft().trim()\">\n <i class=\"pi pi-send\"></i>\n <span>G\u1EEDi th\u00F4ng b\u00E1o</span>\n </button>\n </div>\n </div>\n @if (notificationError()) {\n <p class=\"hero-notification__error\">{{ notificationError() }}</p>\n }\n </div>\n </div>\n }\n\n @if (notificationListDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeNotificationListDialog()\">\n <div class=\"dialog hero-notification-list-dialog\" role=\"dialog\" aria-modal=\"true\"\n aria-label=\"Danh s\u00E1ch th\u00F4ng b\u00E1o\" (click)=\"$event.stopPropagation()\">\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--bell\" aria-hidden=\"true\"><i class=\"pi pi-bell\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--megaphone\" aria-hidden=\"true\"><i class=\"pi pi-megaphone\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--comments\" aria-hidden=\"true\"><i class=\"pi pi-comments\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--star\" aria-hidden=\"true\"><i class=\"pi pi-star\"></i></span>\n <span class=\"hero-notification__bg-icon hero-notification__bg-icon--check\" aria-hidden=\"true\"><i class=\"pi pi-check-circle\"></i></span>\n\n <div class=\"dialog-head hero-notification-list-dialog__head\">\n <div class=\"hero-notification-dialog__title-group\">\n <div class=\"hero-notification-dialog__icon-wrap\"><i class=\"pi pi-megaphone\" aria-hidden=\"true\"></i></div>\n <div>\n <h2 class=\"hero-notification-list-dialog__title\">To\u00E0n b\u1ED9 th\u00F4ng b\u00E1o</h2>\n <p class=\"hero-notification-dialog__subtitle\">{{ visibleNotifications().length }} th\u00F4ng b\u00E1o</p>\n </div>\n </div>\n <div class=\"hero-notification-list-dialog__head-actions\">\n <button type=\"button\" class=\"hero-notification__mark-all\"\n (click)=\"openAcknowledgeAllConfirmDialog()\"\n [disabled]=\"notificationSaving() || visibleNotifications().length === 0\"\n title=\"\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc\">\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i> \u0110\u00E3 \u0111\u1ECDc t\u1EA5t c\u1EA3\n </button>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeNotificationListDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n </div>\n <div class=\"hero-notification-list-dialog__body\">\n @if (visibleNotifications().length > 0) {\n <ul class=\"hero-notification__list\">\n @for (notice of visibleNotifications(); track notice) {\n <li class=\"hero-notification__item\">\n <div class=\"hero-notification__avatar\" aria-hidden=\"true\">{{ notice.user | slice: 0 : 2 | uppercase }}</div>\n <div class=\"hero-notification__body\">\n <div class=\"hero-notification__body-head\">\n <span class=\"hero-notification__author\">{{ notice.user }}</span>\n </div>\n <p class=\"hero-notification__content\">{{ notice.content }}</p>\n @if (notice.createdAt) {\n <span class=\"hero-notification__created\">{{ formatNotificationCreatedAt(notice.createdAt) }}</span>\n }\n </div>\n <div class=\"hero-notification__item-actions\">\n <button type=\"button\" class=\"hero-notification__ack-top\"\n (click)=\"acknowledgeNotification(notice)\" [disabled]=\"notificationSaving()\"\n aria-label=\"\u0110\u00E3 \u0111\u1ECDc th\u00F4ng b\u00E1o\" title=\"\u0110\u00E3 \u0111\u1ECDc\">\n <i class=\"pi pi-times\" aria-hidden=\"true\"></i>\n </button>\n @if (canDeleteNotification(notice)) {\n <button type=\"button\" class=\"hero-notification__delete\"\n (click)=\"deleteNotification(notice)\" [disabled]=\"notificationSaving()\"\n aria-label=\"X\u00F3a th\u00F4ng b\u00E1o\" title=\"X\u00F3a th\u00F4ng b\u00E1o\">\n <i class=\"pi pi-trash\" aria-hidden=\"true\"></i>\n </button>\n }\n </div>\n </li>\n }\n </ul>\n } @else {\n <div class=\"hero-notification__empty\">\n <i class=\"pi pi-bell hero-notification__empty-icon\" aria-hidden=\"true\"></i>\n <span class=\"hero-notification__empty-title\">Kh\u00F4ng c\u00F3 th\u00F4ng b\u00E1o m\u1EDBi</span>\n <span class=\"hero-notification__empty-sub\">M\u1ECDi th\u1EE9 \u0111\u1EC1u \u1ED5n. Th\u00F4ng b\u00E1o m\u1EDBi s\u1EBD xu\u1EA5t hi\u1EC7n \u1EDF \u0111\u00E2y.</span>\n </div>\n }\n </div>\n </div>\n </div>\n }\n\n @if (acknowledgeAllConfirmDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeAcknowledgeAllConfirmDialog()\">\n <div class=\"dialog ack-all-confirm-dialog\" role=\"alertdialog\" aria-modal=\"true\"\n aria-labelledby=\"ack-all-confirm-title\" (click)=\"$event.stopPropagation()\">\n <div class=\"ack-all-confirm-dialog__icon-wrap\" aria-hidden=\"true\"><i class=\"pi pi-check-circle\"></i></div>\n <h2 id=\"ack-all-confirm-title\" class=\"ack-all-confirm-dialog__title\">\u0110\u00E1nh d\u1EA5u t\u1EA5t c\u1EA3 \u0111\u00E3 \u0111\u1ECDc?</h2>\n <p class=\"ack-all-confirm-dialog__desc\">\n T\u1EA5t c\u1EA3 {{ visibleNotifications().length }} th\u00F4ng b\u00E1o s\u1EBD \u0111\u01B0\u1EE3c \u0111\u00E1nh d\u1EA5u \u0111\u00E3 \u0111\u1ECDc v\u00E0 \u1EA9n kh\u1ECFi danh s\u00E1ch.\n </p>\n <div class=\"ack-all-confirm-dialog__actions\">\n <button type=\"button\" class=\"btn ghost\" (click)=\"closeAcknowledgeAllConfirmDialog()\" [disabled]=\"notificationSaving()\">H\u1EE7y</button>\n <button type=\"button\" class=\"btn ack-all-confirm-dialog__confirm-btn\"\n (click)=\"confirmAcknowledgeAll()\" [disabled]=\"notificationSaving()\">\n <i class=\"pi pi-check\" aria-hidden=\"true\"></i> X\u00E1c nh\u1EADn\n </button>\n </div>\n </div>\n </div>\n }\n\n <main\n class=\"content\"\n [class.is-documents]=\"bottomTab() === 'documents'\"\n [class.is-weight]=\"bottomTab() === 'weight'\"\n [class.is-schedule]=\"bottomTab() === 'schedule'\"\n [class.is-mom]=\"bottomTab() === 'mom'\"\n [class.is-medical]=\"bottomTab() === 'medical'\"\n >\n <!--\n ============ TAB PANES ============\n D\u00F9ng `[hidden]` thay v\u00EC `*ngIf` \u0111\u1EC3 c\u00E1c tab c\u00F9ng gi\u1EEF tr\u1EA1ng th\u00E1i khi\n user qua l\u1EA1i: scroll position, search query \u0111ang g\u00F5, viewMode, folder\n \u0111ang \u0111\u1EE9ng, file \u0111ang ch\u1ECDn, draft \u0111ang nh\u1EADp\u2026 \u0111\u1EC1u kh\u00F4ng b\u1ECB reset. H\u1EC7\n qu\u1EA3: `<app-documents>` \u0111\u01B0\u1EE3c mount 1 l\u1EA7n \u1EDF app load \u2014 `loadEntries()`\n ch\u1EA1y 1 l\u1EA7n, c\u00E1c l\u1EA7n switch tab k\u1EBF ti\u1EBFp kh\u00F4ng g\u1ECDi API th\u00EAm.\n -->\n <!-- ============ TAB: DOCUMENTS \u2014 \u0111\u00E3 chuy\u1EC3n sang subroute (m\u1EDF t\u1EEB Settings menu) ============ -->\n\n <!-- ============ TAB: WEIGHT ============ -->\n <div class=\"tab-pane tab-pane--weight\" [hidden]=\"bottomTab() !== 'weight'\">\n <app-weight\n [user]=\"user()\"\n [birthDate]=\"profile()?.birthDate\"\n [gender]=\"profile()?.gender\"\n [babyName]=\"profile()?.babyName\"\n ></app-weight>\n </div>\n\n <!-- ============ TAB: L\u1ECACH \u2014 Google Sheet tab \"Event\" ============ -->\n <div class=\"tab-pane tab-pane--schedule\" [hidden]=\"bottomTab() !== 'schedule'\">\n <app-feeding-schedule [user]=\"user()\"></app-feeding-schedule>\n </div>\n\n <!-- ============ TAB: TI\u1EC0N S\u1EEC Y T\u1EBE \u2014 Medical history V2 ============ -->\n <div class=\"tab-pane tab-pane--medical\" [hidden]=\"bottomTab() !== 'medical'\">\n <app-medical-history\n [user]=\"user()\"\n (openExplorerFile)=\"openMedicalAttachmentInDocuments($event)\"\n ></app-medical-history>\n </div>\n\n <!-- ============ TAB: M\u1EB8 \u2014 \u0111\u00E3 chuy\u1EC3n sang subroute (m\u1EDF t\u1EEB Settings menu) ============ -->\n\n <!-- ============ TAB: FEEDING ============ -->\n <div class=\"tab-pane tab-pane--feeding\" [hidden]=\"bottomTab() !== 'feeding'\">\n <app-feeding-profile\n [user]=\"user()\"\n [profile]=\"profile()\"\n [draft]=\"draft()\"\n [editing]=\"editing()\"\n [maxBirthDate]=\"maxBirthDate\"\n (save)=\"save()\"\n (cancelEdit)=\"cancelEdit()\"\n (startEdit)=\"startEdit()\"\n (clearProfile)=\"clearProfile()\"\n (draftNameChange)=\"updateDraftName($event)\"\n (draftBirthChange)=\"updateDraftBirth($event)\"\n (draftGenderChange)=\"setDraftGender($event)\"\n />\n\n @if (profile() && !editing() && ageBreakdown()) {\n <app-feeding-daily\n [logs]=\"logs()\"\n [feedingSettings]=\"feedingSettings()\"\n [now]=\"now()\"\n [nutritionTarget]=\"nutritionTarget()\"\n [user]=\"user()\"\n [syncMessage]=\"syncMessage()\"\n [syncError]=\"syncError()\"\n [logDialogOpen]=\"logDialogOpen()\"\n [loadingLogs]=\"loadingLogs()\"\n [refreshToken]=\"dailyRefreshToken()\"\n (logsChanged)=\"onFeedingLogsChanged()\"\n (bottlePrepChange)=\"bottlePrep.set($event)\"\n (editLog)=\"feedingDialogs.openEditDialog($event)\"\n (historyOpen)=\"feedingDialogs.openHistoryDialog($event.filter, $event.dateStr)\"\n (feedRowClick)=\"feedingDialogs.onFeedRowClick($event)\"\n >\n <app-feeding-charts\n data-feeding-charts\n [logs]=\"logs()\"\n [now]=\"now()\"\n [nutritionTarget]=\"nutritionTarget()\"\n />\n </app-feeding-daily>\n <app-feeding-nutrition\n [nutritionTarget]=\"nutritionTarget()\"\n [todayStats]=\"todayStats()\"\n [now]=\"now()\"\n [latestWeightKg]=\"latestWeightKgFromSheet()\"\n [editing]=\"editing()\"\n (goToWeight)=\"setBottomTab('weight')\"\n />\n }\n\n <!-- ============ FAB \u00AB Ghi c\u1EEF b\u00FA \u00BB c\u0169 \u0111\u00E3 \u0111\u01B0\u1EE3c thay b\u1EB1ng FAB gi\u1EEFa bottom-nav ============ -->\n </div>\n <!-- /.tab-pane--feeding -->\n </main>\n </div>\n <!-- /.feeding-page -->\n\n <!-- ============ BOTTOM NAVIGATION (C\u1EEF b\u00FA \u00B7 Th\u1EC3 tr\u1EA1ng \u00B7 + \u00B7 L\u1ECBch \u00B7 Y t\u1EBF) ============ -->\n <nav\n class=\"bottom-nav\"\n role=\"tablist\"\n aria-label=\"\u0110i\u1EC1u h\u01B0\u1EDBng ch\u00EDnh\"\n >\n <div class=\"bn-side bn-side--left\">\n @for (tab of navLeftTabs(); track tab.id) {\n <button\n type=\"button\"\n class=\"bn-item\"\n role=\"tab\"\n [attr.aria-selected]=\"bottomTab() === tab.id\"\n [class.active]=\"bottomTab() === tab.id\"\n (click)=\"setBottomTab(tab.id)\"\n >\n <span class=\"bn-icon-wrap\">\n <i class=\"pi {{ tab.icon }} bn-icon\" aria-hidden=\"true\"></i>\n </span>\n <span class=\"bn-label\">{{ tab.label }}</span>\n </button>\n }\n </div>\n\n <button\n type=\"button\"\n class=\"bn-fab\"\n (click)=\"feedingDialogs.openLogDialog()\"\n [disabled]=\"!profile() || editing()\"\n [title]=\"(!profile() || editing()) ? 'Ch\u1ECDn b\u00E9 tr\u01B0\u1EDBc khi ghi c\u1EEF b\u00FA' : 'Ghi nh\u1EADn c\u1EEF b\u00FA m\u1EDBi'\"\n aria-label=\"Ghi nh\u1EADn c\u1EEF b\u00FA\"\n >\n <i class=\"pi pi-plus\" aria-hidden=\"true\"></i>\n </button>\n\n <div class=\"bn-side bn-side--right\">\n @for (tab of navRightTabs(); track tab.id) {\n <button\n type=\"button\"\n class=\"bn-item\"\n role=\"tab\"\n [attr.aria-selected]=\"bottomTab() === tab.id\"\n [class.active]=\"bottomTab() === tab.id\"\n (click)=\"setBottomTab(tab.id)\"\n >\n <span class=\"bn-icon-wrap\">\n <i class=\"pi {{ tab.icon }} bn-icon\" aria-hidden=\"true\"></i>\n </span>\n <span class=\"bn-label\">{{ tab.label }}</span>\n </button>\n }\n </div>\n </nav>\n\n <!-- ============ NOTIFICATION SUBROUTE (full-screen) ============ -->\n @if (notifRouteOpen()) {\n <app-notification-list\n [notifications]=\"allNotifications()\"\n [currentUser]=\"user()\"\n [saving]=\"notificationSaving()\"\n (back)=\"closeNotificationRoute()\"\n (acknowledge)=\"acknowledgeNotification($event)\"\n (acknowledgeAll)=\"openAcknowledgeAllConfirmDialog()\"\n (delete)=\"deleteNotification($event)\"\n (openComposer)=\"openNotificationComposerDialog()\"\n />\n }\n\n <!-- ============ SETTINGS FLOAT MENU (full-screen) ============ -->\n @if (settingsMenuOpen()) {\n <app-settings-menu\n [appName]=\"appInfo.name\"\n [appVersion]=\"appInfo.version\"\n [showDocuments]=\"explorerEnabled\"\n [unreadCount]=\"visibleNotifications().length\"\n (close)=\"closeSettingsMenu()\"\n (select)=\"onSettingsMenuSelect($event)\"\n />\n }\n\n <!-- ============ M\u1EB8 SUBROUTE (full-screen) ============ -->\n @if (momRouteOpen()) {\n <app-subroute-shell\n title=\"M\u1EB9\"\n (back)=\"closeMomRoute()\"\n >\n <app-feeding-mom\n [profile]=\"profile()\"\n [editing]=\"editing()\"\n (goToFeeding)=\"closeMomRoute(); setBottomTab('feeding')\"\n ></app-feeding-mom>\n </app-subroute-shell>\n }\n\n <!-- ============ T\u00C0I LI\u1EC6U SUBROUTE (full-screen) ============ -->\n @if (documentsRouteOpen()) {\n <app-subroute-shell\n title=\"T\u00E0i li\u1EC7u\"\n (back)=\"closeDocumentsRoute()\"\n >\n <app-documents></app-documents>\n </app-subroute-shell>\n }\n\n <!-- About -->\n @if (aboutDialogOpen()) {\n <div class=\"dialog-overlay dialog-overlay--front\" (click)=\"closeAboutDialog()\">\n <div\n class=\"dialog about-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby=\"feeding-about-title\"\n (click)=\"$event.stopPropagation()\"\n >\n <div class=\"dialog-head about-dialog__head\">\n <h2 id=\"feeding-about-title\" class=\"about-dialog__title\">\n <i class=\"pi pi-info-circle\" aria-hidden=\"true\"></i>\n About\n </h2>\n <button type=\"button\" class=\"dialog-close\" (click)=\"closeAboutDialog()\" aria-label=\"\u0110\u00F3ng\">\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <dl class=\"about-dialog__meta\">\n <div class=\"about-dialog__row\">\n <dt>\u1EE8ng d\u1EE5ng</dt>\n <dd>{{ appInfo.name }}</dd>\n </div>\n <div class=\"about-dialog__row\">\n <dt>Phi\u00EAn b\u1EA3n</dt>\n <dd>\n <code>{{ appInfo.version }}</code>\n </dd>\n </div>\n </dl>\n <div class=\"dialog-actions\">\n <button type=\"button\" class=\"btn primary\" (click)=\"closeAboutDialog()\">\u0110\u00F3ng</button>\n </div>\n </div>\n </div>\n }\n\n <!-- Nh\u1EAFc s\u1EF1 ki\u1EC7n l\u1ECBch (sheet Event + Settings) -->\n @if (eventReminderDialogOpen() && scheduleReminderEvents().length > 0) {\n <div\n class=\"dialog-overlay dialog-overlay--front dialog-overlay--event-reminder\"\n (click)=\"closeEventReminderDialog()\"\n >\n <div\n class=\"dialog event-reminder-dialog\"\n role=\"dialog\"\n aria-modal=\"true\"\n (click)=\"$event.stopPropagation()\"\n >\n <div class=\"dialog-head event-reminder-dialog__head\">\n <h2 class=\"event-reminder-dialog__title\">\n <i class=\"pi pi-bell\" aria-hidden=\"true\"></i>\n B\u1EA1n c\u00F3 l\u1ECBch s\u1EAFp t\u1EDBi\n </h2>\n <button\n type=\"button\"\n class=\"dialog-close\"\n (click)=\"closeEventReminderDialog()\"\n aria-label=\"\u0110\u00F3ng\"\n >\n <i class=\"pi pi-times\"></i>\n </button>\n </div>\n <ul class=\"event-reminder-list\">\n @for (ev of scheduleReminderEvents(); track ev) {\n <li>\n <article class=\"event-reminder-card\">\n <h3 class=\"event-reminder-card__title\">{{ ev.title }}</h3>\n <p class=\"event-reminder-card__datetime\">\n <span class=\"event-reminder-card__date\">{{ formatReminderEventWhen(ev) }}</span>\n <span class=\"event-reminder-card__sep\" aria-hidden=\"true\"> \u2013 </span>\n <span class=\"event-reminder-card__hour\">{{\n formatReminderEventTime(ev.time)\n }}</span>\n </p>\n @if (ev.place) {\n <p class=\"event-reminder-card__place\">\n <i class=\"pi pi-map-marker\" aria-hidden=\"true\"></i>\n <span>{{ ev.place }}</span>\n </p>\n }\n @if (ev.note) {\n <div class=\"event-reminder-card__content-wrap\">\n <span class=\"event-reminder-card__content-label\">N\u1ED9i dung</span>\n <p class=\"event-reminder-card__content\">{{ ev.note }}</p>\n </div>\n }\n </article>\n </li>\n }\n </ul>\n <div class=\"dialog-actions event-reminder-actions\">\n <button\n type=\"button\"\n class=\"event-reminder-actions__link\"\n (click)=\"acknowledgeAllEventReminders()\"\n >\n Kh\u00F4ng nh\u1EAFc l\u1EA1i\n </button>\n <button\n type=\"button\"\n class=\"btn primary event-reminder-actions__primary\"\n (click)=\"skipEventReminderSession()\"\n >\n \u0110\u00E3 hi\u1EC3u\n </button>\n </div>\n </div>\n </div>\n }\n\n <app-feeding-dialogs\n #feedingDialogs\n [logs]=\"logs()\"\n [user]=\"user()\"\n [now]=\"now()\"\n [bottlePrep]=\"bottlePrep()\"\n [feedingSettings]=\"feedingSettings()\"\n [prediction]=\"prediction()\"\n [todayStats]=\"todayStats()\"\n [yesterdayStats]=\"yesterdayStats()\"\n [todayLogs]=\"todayLogs()\"\n [yesterdayLogs]=\"yesterdayLogs()\"\n [maxBirthDate]=\"maxBirthDate\"\n [syncError]=\"syncError()\"\n [syncMessage]=\"syncMessage()\"\n (logsChanged)=\"onFeedingLogsChanged()\"\n (settingsChanged)=\"onFeedingSettingsChanged($event)\"\n (syncErrorChange)=\"syncError.set($event)\"\n (syncMessageChange)=\"syncMessage.set($event)\"\n (logDialogOpenChange)=\"logDialogOpen.set($event)\"\n (bottlePrepClearRequested)=\"clearBottlePrep()\"\n />\n</div>\n<!-- /.feeding-root -->\n", styles: ["@charset \"UTF-8\";:host{display:flex;flex-direction:column;position:absolute;inset:0;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;--bg: #f6f7fb;--surface: #ffffff;--border: #e6e8ef;--border-strong: #d1d5db;--primary: #5b6cff;--primary-2: #4c5cf0;--primary-soft: #eef0ff;--accent: #ff5c8a;--accent-soft: #ffe7ef;--mint: #10b981;--mint-soft: #d1fae5;--amber: #f59e0b;--amber-soft: #fef3c7;--rose: #ef4444;--rose-soft: #fee2e2;--text: #0f172a;--muted: #64748b;--muted-2: #94a3b8}.feeding-root{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;position:relative}.feeding-root .bp-prep-user{font-weight:800;color:#0369a1;background:#0ea5e933;padding:0 5px;margin-right:2px;border-radius:5px;white-space:nowrap;transition:color .2s,background .2s}.feeding-root .bp-prep-time{font-weight:800;font-variant-numeric:tabular-nums;color:#0284c7;background:linear-gradient(180deg,#f0f9ff,#e0f2fe);border:1px solid rgba(14,165,233,.35);padding:1px 7px;margin-left:2px;border-radius:6px;white-space:nowrap;box-shadow:0 1px #ffffffa6 inset;transition:color .2s,background .2s,border-color .2s}.feeding-page{position:relative;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;color:var(--text);padding-bottom:calc(170px + env(safe-area-inset-bottom,0px))}.backdrop{position:fixed;inset:0;background:var(--bg);z-index:-1}.hero-notif-wrap{padding:0 16px 8px}.hero{padding:0;background:#fffffff5;border-bottom:1px solid rgba(226,232,240,.9)}@media(max-width:640px){.hero{padding-top:calc(26px + env(safe-area-inset-top,0px));padding-bottom:10px}}.hero-inner{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 18px}.hero-brand{min-width:0}.hero-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;width:100%}.hero-title{display:flex;align-items:center;gap:12px;min-width:0;flex:1}.hero-title .emoji{font-size:36px;line-height:1;flex-shrink:0;filter:drop-shadow(0 2px 4px rgba(15,23,42,.08))}@media(max-width:640px){.hero-title .emoji{font-size:32px}}.hero-title .hero-text{min-width:0}.hero-title h1{margin:0;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.02em;line-height:1.2}@media(max-width:640px){.hero-title h1{font-size:17px}}.hero-title .hero-userline{margin:5px 0 0;display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 6px;font-size:12.5px;color:var(--muted)}.hero-title .hero-userline i{font-size:12px;color:var(--primary);opacity:.9}.hero-title .hero-userline strong{color:var(--primary);font-weight:700;letter-spacing:.01em}.hero-title .hero-userline .hero-last-update{font-size:11px;color:#94a3b8;font-weight:400}.hero--profile-merged{background:var(--primary-soft);padding-bottom:10px;margin-bottom:8px}.hero-title--merged{align-items:flex-start}.hero-title--merged .emoji{font-size:30px}.hero-title--merged h1{font-size:18px;line-height:1.15}.hero-merged-head{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;min-width:0;row-gap:6px}.hero-age-chip{font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:lowercase;color:var(--primary);background:var(--primary-soft);padding:3px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--primary) 18%,transparent);white-space:nowrap}.hero-merged-stat{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:6px;font-size:11px;font-weight:700;color:var(--muted);background:#94a3b824;border:1px solid rgba(148,163,184,.28);white-space:nowrap;line-height:1.25}.hero-merged-stat>i{font-size:10px;opacity:.88;color:var(--muted-2)}.hero-merged-stat--weight>i{color:var(--accent);opacity:1}.hero-merged-meta{margin:5px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:2px 4px;font-size:11.5px;line-height:1.45;color:var(--muted)}.hero-merged-meta .dot{color:var(--muted-2);font-weight:700;-webkit-user-select:none;user-select:none}.hero-merged-meta i{font-size:10px;margin-right:3px;color:var(--muted-2);opacity:.95}.hero-merged-meta strong{color:var(--primary);font-weight:700}.hero-merged-sync{color:#94a3b8;font-weight:400;font-size:11px}.hero-actions--merged{flex-shrink:0}.hero-profile-menu{position:relative;flex:0 0 auto;list-style:none}.hero-profile-menu__trigger{list-style:none}.hero-profile-menu__trigger::-webkit-details-marker{display:none}.hero-profile-menu__trigger::marker{content:\"\"}.hero-profile-menu__panel{position:absolute;top:calc(100% + 6px);right:0;z-index:30;min-width:180px;padding:6px;border-radius:12px;border:1px solid var(--border);background:#fff;box-shadow:0 8px 24px -8px #0f172a2e}.hero-profile-menu__item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:8px;background:transparent;font:inherit;font-size:13px;font-weight:600;color:var(--text);text-align:left;cursor:pointer;transition:background .12s ease,color .12s ease}.hero-profile-menu__item i{font-size:14px;color:var(--muted-2);width:1.1em;text-align:center}.hero-profile-menu__item:hover:not(:disabled){background:var(--primary-soft, #eef0ff);color:var(--primary)}.hero-profile-menu__item:hover:not(:disabled) i{color:var(--primary)}.hero-profile-menu__item--danger:hover:not(:disabled){color:var(--rose);background:var(--rose-soft)}.hero-profile-menu__item--danger:hover:not(:disabled) i{color:var(--rose)}.about-dialog{max-width:360px}.about-dialog__head{margin-bottom:8px}.about-dialog__title{display:flex;align-items:center;gap:8px;margin:0;font-size:18px;font-weight:700}.about-dialog__title i{color:var(--primary)}.about-dialog__meta{margin:0 0 16px;padding:0}.about-dialog__row{display:grid;grid-template-columns:96px 1fr;gap:8px 12px;padding:10px 0;border-bottom:1px solid var(--border)}.about-dialog__row:last-child{border-bottom:0}.about-dialog__row dt{margin:0;font-size:13px;font-weight:600;color:var(--muted-2)}.about-dialog__row dd{margin:0;font-size:14px;font-weight:600;color:var(--text)}.about-dialog__row dd code{font-size:13px;font-weight:600;padding:2px 8px;border-radius:6px;background:var(--primary-soft, #eef0ff);color:var(--primary)}@media(max-width:640px){.hero-title--merged .emoji{font-size:26px}.hero-merged-meta{font-size:11px}.hero-merged-stat{font-size:10.5px;padding:2px 7px}}.hero-datetime{display:flex;flex-wrap:wrap;align-items:center;flex-shrink:0}.hero-datetime-strip{display:inline-flex;align-items:stretch;flex-wrap:nowrap;max-width:100%;min-height:34px;border:1px solid var(--border);border-radius:8px;background:linear-gradient(180deg,#fff,#f1f5f9);box-shadow:0 1px 1px #0f172a0d}.hero-datetime-strip__block{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;min-width:0}.hero-datetime-strip__block>.pi{font-size:12px;color:var(--primary);opacity:.82;flex-shrink:0}.hero-datetime-strip__block--date{flex-wrap:wrap;row-gap:0}.hero-datetime-strip__wd{font-size:10px;font-weight:700;color:var(--muted);text-transform:capitalize;letter-spacing:.02em;line-height:1.15;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero-datetime-strip__date{font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--text);letter-spacing:.02em;white-space:nowrap}.hero-datetime-strip__divider{align-self:stretch;width:1px;margin:5px 0;background:#94a3b866;flex-shrink:0}.hero-datetime-strip__clock{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.04em;color:var(--primary);line-height:1;white-space:nowrap}.hero-datetime-strip__block--time{padding-right:10px}.hero-datetime-strip__block--time>.pi{font-size:11px}@media(max-width:520px){.hero-inner{flex-direction:column;align-items:stretch}.hero-datetime{width:100%;justify-content:flex-start}.hero-datetime-strip{flex:1 1 auto;width:100%;justify-content:space-between}.hero-notification__composer-row{flex-direction:column;align-items:stretch}.hero-notification__send,.hero-notification__cancel{width:100%;justify-content:center}}.hero-notification__bg-icon{position:absolute;pointer-events:none;color:var(--primary);opacity:.13;line-height:1}.hero-notification__bg-icon i{display:block}.hero-notification__bg-icon--bell{top:8%;left:6%;font-size:28px;transform:rotate(-18deg)}.hero-notification__bg-icon--megaphone{top:10%;right:8%;font-size:24px;transform:rotate(12deg)}.hero-notification__bg-icon--comments{bottom:14%;right:10%;font-size:22px;transform:rotate(-8deg)}.hero-notification__bg-icon--send{bottom:10%;left:50%;font-size:20px;transform:rotate(-22deg)}.hero-notification__bg-icon--star{bottom:16%;left:4%;font-size:18px;transform:rotate(20deg)}.hero-notification__bg-icon--bolt{top:46%;right:2%;font-size:20px;transform:rotate(-5deg)}.hero-notification__bg-icon--heart{top:38%;left:14%;font-size:17px;transform:rotate(15deg)}.hero-notification__bg-icon--info{top:4%;left:50%;font-size:18px;transform:rotate(0)}.hero-notification__bg-icon--check{bottom:24%;left:35%;font-size:17px;transform:rotate(8deg)}.hero-notification__bg-icon--eye{top:14%;left:28%;font-size:18px;transform:rotate(-10deg)}.hero-notification{flex:1 1 100%;display:flex;flex-direction:column;gap:10px;margin-top:2px;padding:10px 12px;border:1px solid rgba(148,163,184,.28);border-radius:14px;background:#fff;position:relative;overflow:hidden}.hero-notification__head{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative}.hero-notification__head-actions{display:inline-flex;align-items:center;gap:6px}.hero-notification__composer-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}.hero-notification__composer-label i{color:var(--primary);font-size:12px}.hero-notification__unread-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--primary);color:#fff;font-size:10px;font-weight:700;line-height:1}.hero-notification__add{width:28px;height:28px;border:1px solid rgba(var(--primary-rgb, 76, 92, 240),.25);border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.1);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}.hero-notification__add i{font-size:11px}.hero-notification__add:hover:not(:disabled){background:var(--primary);border-color:var(--primary);color:#fff}.hero-notification__mark-all{height:26px;border:none;border-radius:0;background:transparent;color:var(--primary);font-size:11px;font-weight:600;padding:0;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:4px}.hero-notification__mark-all i{font-size:10px}.hero-notification__mark-all:hover:not(:disabled){opacity:.75}.hero-notification__mark-all:disabled{color:var(--muted-2);cursor:default}.hero-notification__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;position:relative}.hero-notification__item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid #e2e8f0;position:relative;transition:border-color .18s ease,transform .18s ease}@media(hover:hover){.hero-notification__item:hover{border-color:#c7d2fe;transform:translateY(-1px)}}.hero-notification__avatar{width:34px;height:34px;border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.12);border:1.5px solid rgba(var(--primary-rgb, 76, 92, 240),.22);color:var(--primary);font-size:11px;font-weight:700;letter-spacing:.5px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.hero-notification__body{flex:1;min-width:0;padding-right:52px}.hero-notification__body-head{display:flex;align-items:center;gap:6px;margin-bottom:3px}.hero-notification__author{font-size:12px;font-weight:700;color:var(--text)}.hero-notification__content{margin:0;font-size:13.5px;line-height:1.5;color:var(--text);white-space:pre-wrap;word-break:break-word}.hero-notification__created{display:block;margin-top:4px;font-size:11px;color:#94a3b8;font-variant-numeric:tabular-nums}.hero-notification__item-actions{position:absolute;top:7px;right:8px;display:inline-flex;align-items:center;gap:4px}.hero-notification__ack-top{width:24px;height:24px;border:none;border-radius:50%;background:#eff6ff;color:#1d4ed8;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease}.hero-notification__ack-top i{font-size:10px}.hero-notification__ack-top:active:not(:disabled){transform:scale(.96)}.hero-notification__ack-top:hover:not(:disabled){background:#dbeafe;color:#1e40af}.hero-notification__delete{width:24px;height:24px;border:none;border-radius:50%;background:transparent;color:#94a3b8;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.hero-notification__delete i{font-size:10px}.hero-notification__delete:hover:not(:disabled){background:#fee2e2;color:#b91c1c}.hero-notification__empty{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 8px;position:relative}.hero-notification__empty-icon{font-size:28px;color:var(--primary);opacity:.45;margin-bottom:4px}.hero-notification__empty-title{font-size:13px;font-weight:600;color:var(--muted)}.hero-notification__empty-sub{font-size:11px;color:var(--muted-2);text-align:center}.hero-notification__more{align-self:flex-start;border:none;background:transparent;color:var(--primary);font-size:12px;font-weight:700;cursor:pointer;padding:0;font-family:inherit;position:relative}.hero-notification__more:hover{opacity:.75}.hero-notification__composer-row{display:flex;align-items:stretch;gap:8px;min-width:0}.hero-notification__composer-panel{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid #dbe4f3;border-radius:12px;background:#f8fbff}.hero-notification__input-wrap{flex:1;min-width:0;border-radius:11px;border:1.5px solid #cfd8e6;background:#fff;transition:border-color .15s ease;position:relative}.hero-notification__composer-row:focus-within .hero-notification__input-wrap{border-color:var(--primary)}.hero-notification__input{width:100%;min-width:0;min-height:100px;border:0;border-radius:11px;padding:10px 12px 32px;font-size:13px;line-height:1.45;color:var(--text);background:transparent;font-family:inherit;resize:vertical}.hero-notification__input:focus{outline:none}.hero-notification__char-ring{position:absolute;bottom:8px;right:10px;display:flex;align-items:center;gap:4px;pointer-events:none}.hero-notification__char-ring svg{width:22px;height:22px;transform:rotate(-90deg)}.hero-notification__char-ring-track{fill:none;stroke:#e2e8f0;stroke-width:3}.hero-notification__char-ring-fill{fill:none;stroke:var(--primary);stroke-width:3;stroke-dasharray:94 94;stroke-linecap:round;transition:stroke-dashoffset .2s ease}.hero-notification__char-count{font-size:10px;color:var(--muted-2);font-variant-numeric:tabular-nums}.hero-notification__composer-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.hero-notification__send,.hero-notification__cancel{height:36px;border-radius:10px;min-width:86px;padding:0 14px;font-size:12px;font-weight:700}.hero-notification__send{background:var(--primary);color:#fff}.hero-notification__send:not(:disabled):hover{background:var(--primary-2)}.hero-notification__cancel{min-width:72px}.hero-notification__error{margin:0;font-size:12px;color:#b91c1c;position:relative}.hero-notification-dialog{max-width:min(520px,100vw - 24px);overflow:hidden}.hero-notification-dialog .hero-notification__composer-row{align-items:stretch;gap:10px}.hero-notification-dialog .hero-notification__input-wrap{min-height:110px}.hero-notification-dialog__head{margin-bottom:14px}.hero-notification-dialog__title-group{display:flex;align-items:flex-start;gap:10px}.hero-notification-dialog__icon-wrap{width:34px;height:34px;border-radius:10px;background:rgba(var(--primary-rgb, 76, 92, 240),.12);border:1px solid rgba(var(--primary-rgb, 76, 92, 240),.22);color:var(--primary);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.hero-notification-dialog__icon-wrap i{font-size:14px}.hero-notification-dialog__title{margin:0;font-size:15px;font-weight:800;color:var(--text);line-height:1.3}.hero-notification-dialog__subtitle{margin:2px 0 0;font-size:11px;color:var(--muted-2)}.hero-notification-list-dialog{max-width:min(620px,100vw - 24px)}.hero-notification-list-dialog__head{margin-bottom:10px;align-items:flex-start}.hero-notification-list-dialog__head-actions{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}.hero-notification-list-dialog__title{margin:0;font-size:15px;font-weight:800;color:var(--text);line-height:1.3}.hero-notification-list-dialog__body{max-height:min(60vh,480px);overflow-y:auto;padding-right:2px}.ack-all-confirm-dialog{max-width:min(380px,100vw - 24px);text-align:center;padding:28px 24px 24px;display:flex;flex-direction:column;align-items:center;gap:10px;overflow:hidden}.ack-all-confirm-dialog__icon-wrap{width:52px;height:52px;border-radius:50%;background:rgba(var(--primary-rgb, 76, 92, 240),.1);border:1.5px solid rgba(var(--primary-rgb, 76, 92, 240),.2);color:var(--primary);display:flex;align-items:center;justify-content:center;margin-bottom:2px}.ack-all-confirm-dialog__icon-wrap i{font-size:22px}.ack-all-confirm-dialog__title{margin:0;font-size:16px;font-weight:800;color:var(--text)}.ack-all-confirm-dialog__desc{margin:0;font-size:13px;color:var(--muted);line-height:1.55;max-width:280px}.ack-all-confirm-dialog__actions{display:flex;gap:10px;margin-top:6px;width:100%;justify-content:center}.ack-all-confirm-dialog__actions .btn{min-width:96px;height:38px;border-radius:10px;font-size:13px;font-weight:700}.ack-all-confirm-dialog__confirm-btn{background:var(--primary);color:#fff;display:inline-flex;align-items:center;gap:6px}.ack-all-confirm-dialog__confirm-btn i{font-size:12px}.ack-all-confirm-dialog__confirm-btn:not(:disabled):hover{background:var(--primary-2)}.hero-actions{display:flex;gap:8px;align-items:center;flex-shrink:0;align-self:center}.content{width:100%}.content .tab-pane[hidden]{display:none!important}.content .tab-pane--feeding{max-width:1100px;margin:0 auto;padding:0 20px}.content .tab-pane--documents{max-width:none;padding:0}.content .tab-pane--weight{max-width:none;padding:0;background:linear-gradient(180deg,color-mix(in srgb,var(--primary, #5b6cff) 5%,var(--surface, #fff)) 0%,var(--surface, #fff) min(36vh,280px),var(--surface, #fff) 100%)}.content .tab-pane--mom{max-width:1100px;margin:0 auto;padding:0 20px calc(24px + env(safe-area-inset-bottom,0px))}.content .tab-pane--medical{max-width:none;padding:0;background:linear-gradient(180deg,color-mix(in srgb,var(--primary, #5b6cff) 7%,var(--surface, #fff)) 0%,var(--surface, #fff) min(42vh,320px),var(--surface, #fff) 100%)}.bottom-nav{--bn-primary: #5b6cff;--bn-primary-rgb: 91, 108, 255;--bn-inactive: #b0b7c3;--bn-height: 62px;position:fixed;left:0;right:0;bottom:0;width:100%;box-sizing:border-box;z-index:90;display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:var(--bn-height);padding:0 4px env(safe-area-inset-bottom,0px);background:#fffffff5;backdrop-filter:blur(24px) saturate(200%);-webkit-backdrop-filter:blur(24px) saturate(200%);border-top:1px solid rgba(0,0,0,.055);box-shadow:0 -4px 24px -4px #0f172a14}.bottom-nav .bn-side{flex:1;display:flex;align-items:center;justify-content:space-around;min-width:0}.bottom-nav .bn-fab{flex-shrink:0;width:56px;height:56px;margin-top:-20px;border-radius:999px;border:3px solid rgba(255,255,255,.96);background:var(--bn-primary);color:#fff;font-size:22px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .15s ease,background .15s ease,opacity .15s ease}.bottom-nav .bn-fab:hover:not(:disabled){background:var(--primary-2, #4c5cf0);transform:translateY(-2px)}.bottom-nav .bn-fab:active:not(:disabled){transform:translateY(0) scale(.94)}.bottom-nav .bn-fab:disabled{background:var(--bn-inactive);cursor:not-allowed;opacity:.7}.bottom-nav .bn-item{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:var(--bn-height);padding:0 2px;background:transparent;border:none;color:var(--bn-inactive);cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;transition:color .22s ease}.bottom-nav .bn-item .bn-icon-wrap{display:flex;align-items:center;justify-content:center;width:32px;height:30px;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.bottom-nav .bn-item .bn-icon{font-size:21px;line-height:1;transition:filter .22s ease;display:block}.bottom-nav .bn-item .bn-label{font-size:10px;font-weight:500;letter-spacing:.025em;line-height:1;transition:font-weight .22s ease}.bottom-nav .bn-item:not(.active):hover{color:rgba(var(--bn-primary-rgb),.7)}.bottom-nav .bn-item:active .bn-icon-wrap{transform:scale(.88)}.bottom-nav .bn-item.active{color:var(--bn-primary)}.bottom-nav .bn-item.active .bn-icon-wrap{transform:translateY(-3px) scale(1.15)}.bottom-nav .bn-item.active .bn-icon{filter:drop-shadow(0 2px 8px rgba(var(--bn-primary-rgb),.4))}.bottom-nav .bn-item.active .bn-label{font-weight:700}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:16px}.card-header{margin-bottom:16px}.card-header h2{margin:0;font-size:18px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:8px}.card-header h2 i{color:var(--primary)}.card-header p{margin:6px 0 0;color:var(--muted);font-size:13px}.eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted-2);letter-spacing:.06em}.eyebrow i{margin-right:4px}.form{display:flex;flex-direction:column;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.field .label{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.field .label .label-hint{font-size:11px;font-weight:500;color:var(--muted-2);font-style:italic;text-transform:none;letter-spacing:0}.field input[type=text],.field input[type=date],.field input[type=time],.field input[type=number]{padding:12px 14px;border:1.5px solid var(--border);border-radius:10px;font-size:14px;font-family:inherit;color:var(--text);background:#fafbfc;width:100%;min-width:0;box-sizing:border-box;appearance:none;-webkit-appearance:none;transition:border-color .15s,background .15s;min-height:46px;font-variant-numeric:tabular-nums}.field input[type=text]:focus,.field input[type=date]:focus,.field input[type=time]:focus,.field input[type=number]:focus{outline:none;border-color:var(--primary);background:#fff}.field input[type=text]::placeholder,.field input[type=date]::placeholder,.field input[type=time]::placeholder,.field input[type=number]::placeholder{color:var(--muted-2)}.field input[type=number]{-moz-appearance:textfield}.field input[type=number]::-webkit-outer-spin-button,.field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.radio-group{display:flex;gap:8px;flex-wrap:wrap}.chip{padding:9px 16px;border:1.5px solid var(--border);background:#fff;border-radius:999px;font-size:13px;cursor:pointer;color:var(--text);transition:all .15s;font-family:inherit}.chip:hover{border-color:var(--primary);color:var(--primary)}.chip.active{background:var(--primary);border-color:var(--primary);color:#fff}.form-actions{display:flex;gap:10px;margin-top:4px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;border:none;border-radius:10px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.small{padding:6px 12px;font-size:12px}.btn.primary{background:var(--primary);color:#fff}.btn.primary:not(:disabled):hover{background:var(--primary-2)}.btn.ghost{background:transparent;color:var(--muted);border:1.5px solid var(--border)}.btn.ghost:hover{color:var(--text);border-color:var(--border-strong)}.btn.danger-ghost{background:transparent;color:var(--rose);border:1.5px solid var(--rose-soft)}.btn.danger-ghost:hover{background:var(--rose-soft)}.btn.icon-btn{padding:0;width:36px;height:36px;justify-content:center;background:transparent;color:var(--muted);border:1.5px solid var(--border);border-radius:10px}.btn.icon-btn i{font-size:14px}.btn.icon-btn:not(:disabled):hover{color:var(--primary);border-color:var(--primary);background:var(--primary-soft)}.btn.icon-btn .spin{animation:spin-refresh .9s linear infinite}@keyframes spin-refresh{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.age-stats{display:flex;align-items:baseline;justify-content:flex-start;gap:16px;padding:14px 16px;background:var(--primary-soft);border-radius:12px}.age-stats .stat{text-align:center}.age-stats .stat .num{font-size:26px;font-weight:700;color:var(--primary);line-height:1;font-variant-numeric:tabular-nums}.age-stats .stat .unit{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-top:3px}.age-stats .dot{color:var(--muted-2);font-size:20px}.period-card{margin-bottom:0}.period-card h2{margin:6px 0 8px;font-size:20px;font-weight:700}.period-card .period-summary{color:var(--muted);font-size:14px;margin:0 0 14px;line-height:1.55}.schedule-grid{display:grid;grid-template-columns:1fr;gap:10px}.schedule{display:flex;gap:12px;padding:12px;background:#fafbfc;border:1px solid var(--border);border-radius:12px}.schedule i{color:var(--primary);font-size:18px;margin-top:2px}.schedule .schedule-title{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:2px}.schedule .schedule-text{font-size:14px;color:var(--text);line-height:1.5}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}@media(max-width:768px){.compare-grid{grid-template-columns:1fr}}.day-card{margin-bottom:0;min-width:0;overflow:hidden}.day-card.today{border-color:#3b82f6;background:linear-gradient(180deg,#dbeafe,#fff 50%)}.day-card.yesterday{background:#fafbfc}.day-date-nav-wrap{position:relative;margin-bottom:12px}.day-date-nav-reset{position:absolute;top:-8px;right:-8px;z-index:1;width:24px;height:24px;border:1px solid var(--border);border-radius:50%;background:#fff;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:0 1px 3px #0f172a14}.day-date-nav-reset i{font-size:10px}.day-date-nav-reset:hover{background:#fee2e2;border-color:#fecaca;color:#dc2626}.day-date-nav-reset:active{background:#fee2e2;color:#dc2626}.day-date-strip{display:grid;grid-template-columns:32px 1fr 32px;gap:6px;align-items:stretch;padding:6px 8px;border-radius:10px;background:#fff;border:1px solid var(--border);touch-action:manipulation}.day-date-strip-scroller{display:flex;gap:4px;min-width:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding:1px 2px}.day-date-strip-scroller::-webkit-scrollbar{height:4px}.day-date-strip-scroller::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}.day-date-strip-day{flex:0 0 64px;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;padding:6px 4px;border:1px solid transparent;border-radius:8px;background:#f8fafc;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.day-date-strip-day:hover{background:#eef2ff;border-color:#c7d2fe}.day-date-strip-day.active{background:#dbeafe;border-color:#3b82f6;box-shadow:inset 0 0 0 1px #3b82f626}.day-date-strip-date{font-size:12px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2}.day-date-strip-ml{font-size:11px;font-weight:600;color:#1d4ed8;font-variant-numeric:tabular-nums;line-height:1.2}.day-date-strip-ml.empty{color:var(--muted);font-weight:500}.day-date-strip-arrow{width:32px;min-height:52px;flex-shrink:0;border:none;border-radius:8px;background:#f1f5f9;color:var(--text);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.day-date-strip-arrow i{font-size:12px}.day-date-strip-arrow:hover:not(:disabled){background:var(--primary);color:#fff}.day-date-strip-arrow:active:not(:disabled){background:var(--primary);color:#fff}.day-date-strip-arrow:disabled{opacity:.35;cursor:not-allowed}.day-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.day-head h3{margin:4px 0 0;font-size:16px;color:var(--text);font-variant-numeric:tabular-nums}.big-total{display:flex;align-items:baseline;gap:3px}.big-total .num{font-size:32px;font-weight:800;color:var(--text);line-height:1;font-variant-numeric:tabular-nums}.big-total .unit{font-size:14px;color:var(--muted);font-weight:500}.day-stats{display:flex;flex-wrap:wrap;gap:10px 16px;padding:10px 0 0;border-top:1px solid var(--border)}.day-stats>div{font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:5px}.day-stats>div i{color:var(--primary);font-size:12px}.compare-banner{margin-top:12px;padding:12px;background:var(--primary-soft);border-radius:12px;font-size:12px;color:var(--text);display:flex;flex-direction:column;gap:8px}.compare-banner strong{color:var(--primary);font-variant-numeric:tabular-nums;font-weight:700}.compare-banner .compare-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.compare-banner .compare-row:not(:last-child){padding-bottom:8px;border-bottom:1px dashed rgba(15,23,42,.1)}.compare-banner .compare-stats{display:flex;align-items:center;gap:6px;flex:1}.compare-banner .compare-stats .label{color:var(--muted);font-weight:500;font-size:11px}.compare-banner .compare-stats .count{color:var(--muted-2);font-size:11px}.compare-banner .compare-change{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;flex-shrink:0}.compare-banner .compare-change i{font-size:10px}.compare-banner .compare-change i.up{color:var(--mint)}.compare-banner .compare-change i.down{color:var(--amber)}.compare-banner .compare-change strong{font-size:12px}.compare-banner .compare-change span{color:var(--muted-2);font-weight:500}.today-logs{margin-top:12px;padding:12px;background:#fafbfc;border:1px solid var(--border);border-radius:12px}.logs-header{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}.logs-header span{display:flex;align-items:center;gap:6px}.logs-header span:before{content:\"\\1f37c\";font-size:14px}.logs-header .logs-more{text-transform:none;letter-spacing:0;background:transparent;border:none;color:var(--primary);font-size:12px;font-weight:600;padding:4px 8px;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;gap:3px;transition:background .2s ease}.logs-header .logs-more i{font-size:10px}.logs-header .logs-more:hover{background:var(--primary-soft)}.log-list{display:flex;flex-direction:column;gap:6px;min-width:0}.log-row{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#fafbfc;border-radius:8px;font-size:13px;min-width:0;max-width:100%;transition:all .2s ease;position:relative}.log-row.low-volume .log-volume{color:#f59e0b;font-weight:900}.log-row.high-volume .log-volume{color:#10b981;font-weight:900}.log-row:hover{background:#f1f5f9;transform:translateY(-1px);box-shadow:0 2px 8px #0000000d}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.log-time{font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;min-width:42px}.log-volume{font-weight:800;color:var(--primary);font-size:16px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.log-gap{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;background:#f3f4f6;color:#6b7280;border-radius:999px;font-size:10.5px;font-weight:600;white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums;transition:all .2s ease}.log-gap i{font-size:9px;opacity:.7}.log-gap.feed-gap-warn{background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-weight:700;border:1px solid rgba(234,88,12,.45);box-shadow:0 0 0 1px #fff3 inset,0 2px 8px #ea580c59}.log-gap.feed-gap-warn i{opacity:.95;color:inherit}.log-note{color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.log-actions{margin-left:auto;display:inline-flex;align-items:center;gap:2px}.log-edit,.log-del{background:transparent;border:none;color:var(--muted-2);cursor:pointer;padding:4px 6px;border-radius:6px;font-size:12px;transition:all .2s ease}.log-edit:hover{color:var(--primary);background:var(--primary-soft)}.log-del:hover{color:var(--rose);background:var(--rose-soft)}.empty-mini{padding:12px;text-align:center;color:var(--muted-2);font-size:13px;font-style:italic}.countdown-hero{display:flex;flex-direction:column;gap:16px;padding:18px 20px;background:#fff;border-radius:16px;border:1px solid #e6e9ff;transition:all .3s ease;margin-bottom:20px}.countdown-hero .hero-main{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:20px}.countdown-hero .feeding-time-card{flex:1;min-width:0;text-align:center}.countdown-hero .feeding-time-card .time-header{margin-bottom:12px;display:flex;justify-content:center}.countdown-hero .feeding-time-card .time-header .status-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:6px 12px;border-radius:14px;white-space:nowrap}.countdown-hero .feeding-time-card .time-header .status-badge i{font-size:11px}.countdown-hero .feeding-time-card .time-header .status-badge.status-waiting{background:var(--primary-soft);color:var(--primary)}.countdown-hero .feeding-time-card .time-header .status-badge.status-now{background:#fee2e2;color:#dc2626;animation:pulse-gentle 2s ease-in-out infinite;font-size:11px;text-transform:none;font-weight:700}.countdown-hero .feeding-time-card .time-header .status-badge.status-late{background:var(--rose-soft);color:var(--rose)}.countdown-hero .feeding-time-card .time-display .predicted-time{font-size:42px;font-weight:800;line-height:1;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin-bottom:4px}.countdown-hero .feeding-time-card .time-display .time-remaining{font-size:15px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}.countdown-hero .countdown-next{display:flex;flex-direction:column;gap:8px;padding-left:16px;border-left:1px dashed #d8dcff;flex-shrink:0;min-width:0}.countdown-hero .next-item{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.countdown-hero .next-item i{color:var(--primary);font-size:13px}.countdown-hero .next-item strong{font-weight:700}.countdown-hero .next-item .predict-label,.countdown-hero .next-item .recommend-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);margin-left:4px}.countdown-hero .next-item .recommend-label{color:var(--mint)}.countdown-hero .volume-info{display:flex;flex-direction:column;gap:8px;padding-left:20px;border-left:1px dashed #d8dcff;flex-shrink:0;min-width:160px;transition:all .3s ease}.countdown-hero .volume-info .volume-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.countdown-hero .volume-info .volume-row .volume-prefix{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2);flex-shrink:0}.countdown-hero .volume-info .volume-row .volume-amount{font-size:22px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;line-height:1;text-align:right}.countdown-hero .volume-info .volume-row.predicted-row .volume-prefix,.countdown-hero .volume-info .volume-row.predicted-row .volume-amount{color:var(--primary)}.countdown-hero .volume-info .volume-row.recommended-row .volume-prefix,.countdown-hero .volume-info .volume-row.recommended-row .volume-amount{color:var(--mint)}.countdown-hero[data-status=waiting]{border-color:#bbf7d0;background:linear-gradient(135deg,#f7fef8,#f0fdf4)}.countdown-hero[data-status=waiting] .feeding-time-card .time-display .predicted-time{color:#16a34a}.countdown-hero[data-status=waiting] .feeding-time-card .time-display .time-remaining{color:#15803d}.countdown-hero[data-status=waiting] .feeding-time-card .status-badge.status-waiting{background:#dcfce7!important;color:#15803d!important;border:1px solid #86efac}.countdown-hero[data-status=waiting] .volume-info .volume-amount{color:#16a34a}.countdown-hero[data-status=waiting] .volume-info .volume-prefix{color:#15803d}.countdown-hero[data-status=late]{border-color:#fca5a5;background:linear-gradient(135deg,#fef2f2,#fee2e2)}.countdown-hero[data-status=late] .feeding-time-card .time-display .predicted-time{color:#dc2626}.countdown-hero[data-status=late] .feeding-time-card .time-display .time-remaining{color:#b91c1c}.countdown-hero[data-status=late] .feeding-time-card .status-badge.status-late{background:#fee2e2;color:#dc2626;border:1px solid #fca5a5}.countdown-hero[data-status=late] .volume-info .volume-amount{color:#dc2626}.countdown-hero[data-status=late] .volume-info .volume-prefix{color:#b91c1c}.countdown-hero[data-status=now]{border-color:#fbbf24;background:linear-gradient(135deg,#fefce8,#fef3c7);animation:pulse-card 2s ease-in-out infinite}.countdown-hero[data-status=now] .feeding-time-card .time-display .predicted-time{color:#92400e}.countdown-hero[data-status=now] .feeding-time-card .time-display .time-remaining{color:#a16207}.countdown-hero[data-status=now] .feeding-time-card .status-badge.status-now{background:#fef3c7!important;color:#b45309!important;border:1px solid #f59e0b!important}.countdown-hero[data-status=now] .volume-info .volume-amount{color:#92400e}.countdown-hero[data-status=now] .volume-info .volume-prefix{color:#a16207}@media(max-width:540px){.countdown-hero .hero-main{flex-direction:column;align-items:stretch;gap:12px}.countdown-hero .hero-main .volume-info{border-left:none;border-top:1px dashed #d8dcff;padding-left:0;padding-top:12px;min-width:auto}.countdown-hero .hero-main .volume-info .volume-row{justify-content:space-between;padding:0 4px}.countdown-hero .hero-main .feeding-time-card .time-display .predicted-time{font-size:36px}.countdown-hero .hero-main .feeding-time-card .volume-info .volume-amount{font-size:20px}}@media(max-width:400px){.countdown-hero .feeding-time-card .status-badge{font-size:10px;padding:4px 10px}.countdown-hero .feeding-time-card .time-display .predicted-time{font-size:32px}.countdown-hero .volume-info .volume-amount{font-size:18px}}@keyframes pulse-soft{0%,to{opacity:1}50%{opacity:.65}}@keyframes pulse-gentle{0%,to{opacity:1}50%{opacity:.75}}@keyframes pulse-urgent{0%,to{opacity:1;text-shadow:0 0 0 rgba(239,68,68,0)}50%{opacity:.8;text-shadow:0 0 8px rgba(239,68,68,.25)}}@keyframes pulse-card{0%,to{transform:scale(1);box-shadow:0 1px 3px #0000001a,0 0 #f8717100}50%{transform:scale(1.02);box-shadow:0 4px 12px #00000026,0 0 0 2px #f871714d}}.burp-warning{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;margin:0 0 16px;background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #f59e0b;border-radius:14px;box-shadow:0 2px 8px #f59e0b33;animation:burp-pulse 2s ease-in-out infinite}.burp-warning__icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#f59e0b;border-radius:50%;color:#fff;font-size:18px;animation:burp-icon-bounce 1.5s ease-in-out infinite}.burp-warning__content{flex:1;min-width:0}.burp-warning__title{font-size:15px;font-weight:700;color:#92400e;margin-bottom:4px}.burp-warning__text{font-size:13px;color:#78350f;line-height:1.5;margin-bottom:8px}.burp-warning__text strong{font-weight:600;color:#92400e}.burp-warning__countdown{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#ffffffb3;border-radius:8px;font-size:13px;color:#92400e;font-weight:500}.burp-warning__countdown i{font-size:14px;color:#f59e0b}.burp-warning__countdown strong{font-size:16px;font-weight:700;color:#d97706}@keyframes burp-pulse{0%,to{box-shadow:0 2px 8px #f59e0b33}50%{box-shadow:0 4px 16px #f59e0b59}}@keyframes burp-icon-bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.countdown-progress{margin-top:10px}.countdown-progress .cp-track{position:relative;height:6px;background:#ffffffbf;border-radius:999px;overflow:hidden}.countdown-progress .cp-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:999px;transition:width .4s ease}.countdown-progress .cp-fill[data-status=waiting]{background:linear-gradient(90deg,#22c55e,#16a34a)}.countdown-progress .cp-fill[data-status=late]{background:linear-gradient(90deg,#f87171,#dc2626)}.countdown-progress .cp-fill[data-status=now]{background:linear-gradient(90deg,#fbbf24,#d97706)}.countdown-progress .cp-labels{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;font-size:11.5px;color:var(--muted)}.countdown-progress .cp-labels i{font-size:10px;margin-right:2px;color:var(--muted-2)}.countdown-progress .cp-labels .muted{color:var(--muted-2)}.countdown-progress .cp-labels .cp-right{font-weight:600;color:var(--muted);white-space:nowrap}.predict-head{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:12px;margin-bottom:16px}.predict-head .eyebrow{color:var(--primary);display:flex;align-items:center;gap:4px}.predict-head .eyebrow.sparkle i{animation:sparkle 2s ease-in-out infinite}.predict-head h2{margin:4px 0 0;font-size:20px;font-weight:700}.last-feed{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;border-radius:12px;margin-bottom:14px;border:1px solid #e8e9ff}.last-feed .last-feed-icon{width:38px;height:38px;border-radius:50%;background:var(--primary-soft);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.last-feed .last-feed-icon i{color:var(--primary);font-size:16px}.last-feed .last-feed-body{flex:1;min-width:0}.last-feed .last-feed-label{font-size:10px;font-weight:700;text-transform:uppercase;color:var(--muted-2);letter-spacing:.06em;margin-bottom:2px}.last-feed .last-feed-value{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.last-feed .last-feed-value strong{color:var(--primary);font-size:18px;font-weight:800}.last-feed .last-feed-value .sep{color:var(--muted-2)}.last-feed .last-feed-value .ago{color:var(--accent);font-weight:600;font-size:13px}.last-feed .last-feed-note{margin-top:4px;font-size:12px;color:var(--muted);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.predict-empty{padding:14px 16px;background:#fff;border-radius:12px;color:var(--muted);font-size:13px;display:flex;align-items:center;gap:8px}.predict-empty i{color:var(--primary)}.predict-body{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}@media(max-width:640px){.predict-body{grid-template-columns:1fr}}.predict-metric{background:#fff;border-radius:12px;padding:14px;text-align:center}.predict-metric .metric-label{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:6px;display:flex;align-items:center;justify-content:center;gap:5px}.predict-metric .metric-label i{color:var(--primary);font-size:12px}.predict-metric .metric-value{font-size:28px;font-weight:800;line-height:1;color:var(--primary);font-variant-numeric:tabular-nums}.predict-metric .metric-value .ml-unit{font-size:14px;color:var(--muted);font-weight:500;margin-left:2px}.predict-metric .metric-sub{margin-top:6px;font-size:12px;color:var(--muted)}.reasoning{background:#fff;border-radius:12px;padding:12px 14px;margin-bottom:12px}.reasoning .reasoning-head{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted);letter-spacing:.05em;margin-bottom:6px}.reasoning .reasoning-head i{color:var(--primary);margin-right:4px}.reasoning ul{margin:0;padding-left:18px;list-style:disc}.reasoning li{font-size:13px;color:var(--text);line-height:1.55;margin:2px 0}.predict-actions{display:flex;justify-content:flex-end}.feed-list-card{margin-bottom:16px}.feed-list-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.feed-list-head h2{margin:4px 0 0;font-size:18px;font-weight:700}.feed-list-compact{display:flex;flex-direction:column;gap:6px}.feed-row{display:grid;grid-template-columns:68px 80px 1fr auto;gap:10px;align-items:center;padding:10px 12px;transition:all .2s ease;position:relative}.feed-row.low-volume .feed-row-volume strong{color:#f59e0b;font-weight:900}.feed-row.high-volume .feed-row-volume strong{color:#10b981;font-weight:900}.feed-row{background:#fafbfc;border-radius:10px;border:1px solid var(--border)}.feed-row .feed-row-time{display:flex;flex-direction:column;line-height:1.2;font-variant-numeric:tabular-nums;gap:3px}.feed-row .feed-row-time .time{font-weight:700;color:var(--text);font-size:14px}.feed-row .feed-row-time .date{font-size:11px;color:var(--muted-2)}.feed-row .feed-row-time .feed-row-gap{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:600;color:#6b7280;background:#f3f4f6;padding:1px 6px;border-radius:999px;width:fit-content;white-space:nowrap;font-variant-numeric:tabular-nums}.feed-row .feed-row-time .feed-row-gap i{font-size:8px;opacity:.7}.feed-row .feed-row-time .feed-row-gap.feed-gap-warn{background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-weight:700;border:1px solid rgba(234,88,12,.45);box-shadow:0 0 0 1px #fff3 inset,0 2px 8px #ea580c59}.feed-row .feed-row-time .feed-row-gap.feed-gap-warn i{opacity:.95;color:inherit}.feed-row .feed-row-volume{font-variant-numeric:tabular-nums}.feed-row .feed-row-volume strong{color:var(--primary);font-size:19px;font-weight:800;letter-spacing:-.01em}.feed-row .feed-row-volume .u{font-size:11px;color:var(--muted);margin-left:2px}.feed-row .feed-row-note{font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.feed-row .feed-row-note.muted{color:var(--muted-2);font-style:italic}.feed-row .feed-row-actions{display:inline-flex;align-items:center;gap:2px;margin-left:auto}.feed-row .feed-row-edit,.feed-row .feed-row-del{background:transparent;border:none;color:var(--muted-2);cursor:pointer;padding:6px 8px;border-radius:6px;font-size:13px}.feed-row .feed-row-edit:hover{color:var(--primary, #5b6cff);background:#5b6cff1a}.feed-row .feed-row-del:hover{color:var(--rose);background:var(--rose-soft)}@media(max-width:480px){.feed-row{grid-template-columns:58px 70px 1fr auto;gap:8px;padding:8px 10px}.feed-row .feed-row-time .time{font-size:13px}}.dialog-wide{max-width:720px;display:flex;flex-direction:column;padding:0;overflow:hidden}@media(max-width:640px){.dialog-wide{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 72px);border-radius:14px}}.dialog-wide .dialog-head{position:sticky;top:0;z-index:5;background:var(--surface);padding:16px 20px;margin:0;border-bottom:1px solid var(--border);-webkit-backdrop-filter:saturate(1.2) blur(6px);backdrop-filter:saturate(1.2) blur(6px)}@media(max-width:640px){.dialog-wide .dialog-head{padding:12px 14px}}.dialog-wide .dialog-close{width:40px;height:40px;font-size:16px;background:#f1f3f7;color:var(--text)}.dialog-wide .dialog-close:hover{background:var(--rose-soft);color:var(--rose)}.dialog-wide .history-body,.dialog-wide .tips-dialog-body{padding:18px 20px 24px;overflow-y:auto;flex:1;min-height:0}@media(max-width:640px){.dialog-wide .history-body,.dialog-wide .tips-dialog-body{padding:14px 14px 20px}}.history-body{display:flex;flex-direction:column;gap:18px}.history-paging-hint{margin:0;font-size:12px;line-height:1.45}.history-load-more{display:grid;justify-items:center;width:100%;box-sizing:border-box;padding:8px 0 12px}.history-load-more .btn{width:auto;max-width:min(320px,100%);min-width:0;margin-inline:auto;justify-content:center}.tips-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px;background:#f1f3f7;border-radius:12px;margin-bottom:16px}.nav-arrow{width:40px;height:40px;border-radius:50%;border:none;background:#fff;color:var(--primary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:16px;transition:all .15s;flex-shrink:0}.nav-arrow:hover:not(:disabled){background:var(--primary);color:#fff;transform:scale(1.05)}.nav-arrow:active:not(:disabled){transform:scale(.95)}.nav-arrow:disabled{opacity:.35;cursor:not-allowed}.tips-now-btn{flex:1;padding:9px 16px;border:none;background:transparent;border-radius:999px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:all .15s}.tips-now-btn i{font-size:12px}.tips-now-btn:hover{color:var(--primary);background:#fff}.tips-now-btn.active{background:var(--primary);color:#fff;pointer-events:none}.tips-dialog-body .period-summary{font-size:14px;color:var(--muted);line-height:1.6;margin:0 0 14px}.tips-dialog-body .schedule-grid{grid-template-columns:repeat(2,1fr);margin-bottom:16px}@media(max-width:560px){.tips-dialog-body .schedule-grid{grid-template-columns:1fr}}.dialog-tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.history-group .history-group-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--primary-soft);border-radius:10px;margin-bottom:8px}.history-group .history-group-head .h-date{font-size:14px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.history-group .history-group-head .h-day{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.history-group .history-group-head .h-total{font-size:14px;color:var(--text);font-variant-numeric:tabular-nums}.history-group .history-group-head .h-total strong{color:var(--primary);font-size:20px;font-weight:800}.history-group .history-group-head .h-total .h-count{color:var(--muted);font-size:12px;font-weight:500;margin-left:4px}.history-group .history-group-head .h-total .h-avg{color:var(--primary);font-size:12px;font-weight:600;margin-left:4px;font-variant-numeric:tabular-nums}.history-group .history-group-rows{display:flex;flex-direction:column;gap:4px}.tips-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:4px 4px 0}.tips-section-head .eyebrow i{margin-right:4px}.tips-section-head h2{margin:4px 0 0;font-size:20px;font-weight:700;color:var(--text)}.filter-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.filter-chip{padding:7px 14px;border:1.5px solid var(--border);background:#fff;border-radius:999px;font-size:13px;font-weight:500;cursor:pointer;color:var(--muted);display:inline-flex;align-items:center;gap:5px;transition:all .15s;font-family:inherit}.filter-chip i{font-size:12px}.filter-chip:hover{border-color:var(--cat-color, var(--primary));color:var(--cat-color, var(--primary))}.filter-chip.active{background:var(--cat-color, var(--primary));border-color:var(--cat-color, var(--primary));color:#fff}.tips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:20px}.tip-card{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--cat-color, var(--primary));border-radius:12px;padding:16px;transition:transform .15s}.tip-card:hover{transform:translateY(-2px)}.tip-card .tip-head{margin-bottom:8px}.tip-card .tip-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;background:var(--cat-color, var(--primary));color:#fff;font-size:11px;font-weight:600;border-radius:999px;text-transform:uppercase;letter-spacing:.04em}.tip-card .tip-pill i{font-size:10px}.tip-card .tip-title{margin:6px 0 8px;font-size:15px;font-weight:700;line-height:1.35;color:var(--text)}.tip-card .tip-body{margin:0;font-size:13px;line-height:1.55;color:var(--muted)}.empty{grid-column:1/-1;padding:40px 20px;text-align:center;color:var(--muted-2)}.empty i{font-size:32px;margin-bottom:8px;display:block}.upcoming{margin-bottom:24px}.upcoming h3{margin:0 0 12px;font-size:16px;font-weight:600;color:var(--text);display:flex;align-items:center;gap:6px}.upcoming h3 i{color:var(--primary)}.upcoming-grid{display:flex;gap:8px;flex-wrap:wrap}.upcoming-item{padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:10px;font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}.upcoming-item i{color:var(--primary);font-size:12px}.disclaimer{padding:16px;background:var(--amber-soft);border-radius:12px;color:#78350f;font-size:13px;line-height:1.5;margin-bottom:24px;display:flex;gap:8px;align-items:flex-start}.disclaimer i{color:var(--amber);margin-top:2px}.toast{position:fixed;bottom:100px;left:50%;transform:translate(-50%);z-index:90;padding:12px 18px;border-radius:12px;font-size:14px;font-weight:500;box-shadow:0 6px 24px #0f172a1f;display:flex;align-items:center;gap:8px;animation:toastIn .3s cubic-bezier(.4,0,.2,1)}.toast.success{background:var(--mint);color:#fff}.toast.error{background:var(--rose);color:#fff}@keyframes toastIn{0%{transform:translate(-50%,20px);opacity:0}to{transform:translate(-50%);opacity:1}}.fab{position:fixed;bottom:calc(80px + env(safe-area-inset-bottom,0px));right:20px;z-index:96;display:inline-flex;align-items:center;gap:10px;padding:14px 22px 14px 18px;background:var(--primary);color:#fff;border:none;border-radius:999px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:0 8px 24px #5b6cff73;transition:transform .15s,box-shadow .15s,background .15s}.fab i{font-size:18px;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#ffffff2e}.fab .fab-label{white-space:nowrap}.fab:hover{background:var(--primary-2);transform:translateY(-2px);box-shadow:0 12px 28px #5b6cff8c}.fab:active{transform:translateY(0)}@media(max-width:480px){.fab{padding:14px}.fab .fab-label{display:none}.fab i{font-size:22px;width:28px;height:28px}}.dialog-overlay{position:fixed;inset:0;background:#0f172a8c;z-index:110;display:flex;align-items:center;justify-content:center;padding:20px;animation:overlayIn .2s ease-out}.dialog-overlay.dialog-overlay--front{z-index:400}.dialog-overlay.dialog-overlay--event-reminder{z-index:410}@media(max-width:640px){.dialog-overlay{padding:calc(env(safe-area-inset-top,0px) + 16px) 12px calc(env(safe-area-inset-bottom,0px) + 16px);align-items:flex-start}}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}.dialog{background:var(--surface);border-radius:20px;width:100%;max-width:560px;max-height:min(100vh - 40px,100dvh - 40px);overflow-y:auto;padding:24px;animation:dialogIn .25s cubic-bezier(.4,0,.2,1);box-shadow:0 20px 60px #0f172a40}@media(max-width:640px){.dialog{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 32px);border-radius:16px}}@keyframes dialogIn{0%{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}.dialog-head h2{margin:4px 0 0;font-size:20px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}.dialog-head h2 i{color:var(--primary)}.dialog-close{background:#f1f3f7;border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;color:var(--muted);font-size:14px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,color .15s}.dialog-close:hover{background:var(--rose-soft);color:var(--rose)}.log-form{display:flex;flex-direction:column;gap:14px}.log-volume-field{margin:0}.log-volume-field .log-volume-input-row{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 10px;min-width:0}.log-volume-field .log-volume-input-row>input[type=number]{flex:0 0 118px;width:118px;max-width:min(118px,100%);min-width:0}.log-volume-field .predict-hint--inline{flex:1 1 auto;min-width:0;margin:0;padding:6px 10px;gap:6px;font-size:12px;border-radius:8px}.log-volume-field .predict-hint--inline>i{font-size:13px;flex-shrink:0}.log-volume-field .predict-hint--inline .hint-text{flex:1 1 auto;min-width:0;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.log-volume-field .predict-hint--inline .btn.small{flex-shrink:0;padding:4px 8px;font-size:11px}@media(max-width:400px){.log-volume-field .log-volume-input-row>input[type=number]{flex:1 1 100px;width:100%;max-width:none}.log-volume-field .predict-hint--inline{flex:1 1 100%;white-space:normal}.log-volume-field .predict-hint--inline .hint-text{white-space:normal;overflow:visible;text-overflow:unset}}.edit-date-banner{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 14px;background:linear-gradient(135deg,#eef2ff,#f5f3ff);border:1px solid #dbe1ff;border-radius:12px;font-size:13px;color:var(--text)}.edit-date-banner>i.pi-calendar{color:var(--primary, #5b6cff);font-size:15px}.edit-date-banner .edb-label{color:var(--muted, #6b7280);font-weight:500}.edit-date-banner .edb-value{font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.01em}.edit-date-banner .edb-lock{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex-shrink:0;border-radius:50%;background:#ffffffe0;border:1px solid #e2e8f0;color:var(--muted, #64748b)}.edit-date-banner .edb-lock i{font-size:14px;line-height:1}.log-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.log-grid .field.full{grid-column:1/-1}.log-grid.log-grid--date-time{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:560px){.log-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:380px){.log-grid{grid-template-columns:1fr}}.quick-volumes{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.quick-volumes .quick-label{font-size:12px;color:var(--muted);font-weight:600;margin-right:4px}.quick-chip{padding:7px 13px;background:#f1f3f7;border:none;border-radius:999px;font-size:12px;font-weight:600;cursor:pointer;color:var(--muted);transition:all .15s;font-family:inherit}.quick-chip:hover{background:var(--primary-soft);color:var(--primary)}.quick-chip.now-chip{background:var(--primary-soft);color:var(--primary);display:inline-flex;align-items:center;gap:4px}.quick-chip.now-chip:hover{background:var(--primary);color:#fff}.quick-chip.formula-chip{display:inline-flex;align-items:center;gap:5px;background:#fff7ed;color:#c2410c;border:1px solid #fed7aa}.quick-chip.formula-chip i{font-size:11px;opacity:.9}.quick-chip.formula-chip:hover{background:#ffedd5;color:#9a3412;border-color:#fdba74}.quick-chip.formula-chip.active{background:#c2410c;color:#fff;border-color:#c2410c;box-shadow:0 2px 8px #c2410c40}.quick-chip.formula-chip.active:hover{background:#9a3412;border-color:#9a3412;color:#fff}.bottle-prep{background:#f0f9ff;border:1px solid #bae6fd;border-radius:12px;padding:8px 12px;margin-bottom:16px;display:flex;flex-direction:column;gap:8px;transition:background .2s,border-color .2s}.bottle-prep:has(.bp-warning){background:#fffbeb;border-color:#fde68a}.bottle-prep:has(.bp-warning) .bp-info>i{color:#f59e0b}.bottle-prep:has(.bp-warning) .bp-info strong{color:#d97706}.bottle-prep:has(.bp-warning) .bp-prep-user{color:#92400e;background:#fbbf246b}.bottle-prep:has(.bp-warning) .bp-prep-time{color:#c2410c;background:linear-gradient(180deg,#fff7ed,#ffedd5);border-color:#fb923c73}.bottle-prep:has(.bp-form){align-items:stretch;padding:10px 12px 12px}.bottle-prep .bp-warning{display:flex;align-items:center;justify-content:space-between;gap:10px;animation:slideDown .2s ease;flex-wrap:wrap}.bottle-prep .bp-warning__content{display:flex;align-items:center;gap:8px;font-size:13px;flex:1;min-width:0}.bottle-prep .bp-warning__content i{font-size:16px;flex-shrink:0}.bottle-prep .bp-warning__content strong{font-weight:700}.bottle-prep .bp-warning--expired{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:8px 10px;color:#991b1b}.bottle-prep .bp-warning--expired i{color:#dc2626}.bottle-prep .bp-warning--soon{background:#fefce8;border:1px solid #fde68a;border-radius:8px;padding:8px 10px;color:#92400e}.bottle-prep .bp-warning--soon i{color:#f59e0b}.bottle-prep .bp-warning__btn{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;padding:7px 12px;font-size:12px;font-weight:700;font-family:inherit;color:#fff;background:linear-gradient(180deg,#f59e0b,#d97706);border:none;border-radius:8px;cursor:pointer;box-shadow:0 2px 4px #f59e0b40;transition:all .15s ease}.bottle-prep .bp-warning__btn i{font-size:12px}.bottle-prep .bp-warning__btn:hover{background:linear-gradient(180deg,#fbbf24,#f59e0b);transform:translateY(-1px);box-shadow:0 4px 8px #f59e0b59}.bottle-prep .bp-warning__btn:active{transform:translateY(0)}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.bottle-prep .bp-info-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.bottle-prep:not(:has(.bp-warning)):not(:has(.bp-form)){flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}.bottle-prep .bp-info{display:flex;align-items:flex-start;gap:8px;font-size:14px;color:var(--text);flex:1;min-width:0}.bottle-prep .bp-info>i{color:#0ea5e9;font-size:16px;margin-top:2px;flex-shrink:0}.bottle-prep .bp-info .bp-text{line-height:1.45;min-width:0}.bottle-prep .bp-info .bp-useby{display:inline-block;margin-top:2px;font-size:13px}.bottle-prep .bp-info strong{color:#0284c7;font-weight:800;font-variant-numeric:tabular-nums}.bottle-prep .bp-info .muted{color:var(--muted);font-size:13px}.bottle-prep .bp-actions{display:flex;gap:4px}.bottle-prep .bp-add{flex:1;background:transparent;border:none;padding:6px 4px;font-size:13px;font-weight:600;color:#0284c7;cursor:pointer;display:flex;align-items:center;gap:8px;font-family:inherit;text-align:left}.bottle-prep .bp-add>i{font-size:15px}.bottle-prep .bp-add:hover{color:#0369a1}.bottle-prep .bp-form{display:flex;flex-direction:column;gap:8px;width:100%}.bottle-prep .bp-form-head{display:flex;align-items:center;gap:6px}.bottle-prep .bp-form-head>i{color:#0ea5e9;font-size:15px}.bottle-prep .bp-form-head .bp-label{font-size:13px;color:var(--muted);font-weight:600;white-space:nowrap}.bottle-prep .bp-input-wrap{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #7dd3fc;border-radius:10px;padding:3px;transition:border-color .15s,box-shadow .15s}.bottle-prep .bp-input-wrap:focus-within{border-color:#0ea5e9;box-shadow:0 0 0 3px #0ea5e926}.bottle-prep .bp-input-wrap .bp-step{width:30px;height:30px;flex-shrink:0;border-radius:8px;border:none;background:#e0f2fe;color:#0369a1;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-family:inherit;transition:all .12s}.bottle-prep .bp-input-wrap .bp-step:hover{background:#bae6fd;color:#0284c7}.bottle-prep .bp-input-wrap .bp-step:active{transform:scale(.94)}.bottle-prep .bp-input-wrap .bp-step:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.bottle-prep .bp-input-wrap .bp-input{flex:1;min-width:60px;padding:4px 6px;font-size:18px;font-weight:800;border:none;background:transparent;font-variant-numeric:tabular-nums;font-family:inherit;color:#d97706;text-align:center;letter-spacing:-.01em}.bottle-prep .bp-input-wrap .bp-input:focus{outline:none}.bottle-prep .bp-input-wrap .bp-input:disabled{opacity:.55;cursor:not-allowed}.bottle-prep .bp-input-wrap .bp-unit{font-size:12px;color:var(--muted);font-weight:600;padding-right:4px}.bottle-prep .bp-quick{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.bottle-prep .bp-quick .bp-quick-label{font-size:11px;color:var(--muted);font-weight:600;margin-right:2px}.bottle-prep .bp-quick .bp-quick-chip{padding:4px 9px;background:#f0f9ff;border:1px solid #7dd3fc;border-radius:999px;font-size:11.5px;font-weight:700;color:#0369a1;cursor:pointer;font-family:inherit;font-variant-numeric:tabular-nums;transition:all .12s}.bottle-prep .bp-quick .bp-quick-chip:hover{background:#e0f2fe;border-color:#38bdf8;color:#0284c7}.bottle-prep .bp-quick .bp-quick-chip:active{transform:scale(.95)}.bottle-prep .bp-quick .bp-quick-chip:disabled{opacity:.45;cursor:not-allowed}.bottle-prep .bp-form-actions{display:flex;gap:6px;justify-content:flex-end}.bottle-prep .bp-btn{width:32px;height:32px;border-radius:8px;border:none;background:#fff;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:12px;transition:all .15s;flex-shrink:0}.bottle-prep .bp-btn:hover:not(:disabled){background:#e0f2fe;color:#0284c7}.bottle-prep .bp-btn:disabled{opacity:.45;cursor:not-allowed}.bottle-prep .bp-btn.primary{background:#0ea5e9;color:#fff}.bottle-prep .bp-btn.primary:hover:not(:disabled){background:#0284c7}.bottle-prep .bp-btn.danger:hover{background:var(--rose-soft);color:var(--rose)}.calc-block{border:1px solid #fde7c2;background:#fffaf0;border-radius:12px;overflow:hidden}.calc-block .calc-head{padding:10px 14px 0}.calc-block .prep-info{display:flex;align-items:flex-start;gap:6px;font-size:13px;color:var(--text)}.calc-block .prep-info>i{color:#f59e0b;font-size:14px;margin-top:2px;flex-shrink:0}.calc-block .prep-info .prep-info-text{line-height:1.45;min-width:0}.calc-block .prep-info strong{color:#d97706;font-weight:800;font-variant-numeric:tabular-nums}.calc-block .prep-info .muted{color:var(--muted-2);font-size:12px;display:inline-block;margin-top:2px}.calc-block .calc-body{padding:8px 14px 14px;display:flex;flex-direction:column;gap:10px}.calc-block .field.mini.remaining-input{position:relative;margin:0;display:flex;flex-direction:column}.calc-block .field.mini.remaining-input .label{font-size:11px;font-weight:600;color:var(--muted);margin-bottom:4px}.calc-block .field.mini.remaining-input input{width:100%;padding:10px 36px 10px 12px;font-size:16px;font-weight:700;border:1px solid #fadf9e;border-radius:8px;background:#fff;font-variant-numeric:tabular-nums;font-family:inherit;color:#d97706}.calc-block .field.mini.remaining-input input:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b26}.calc-block .field.mini.remaining-input .suffix{position:absolute;right:12px;top:50%;transform:translateY(4px);font-size:12px;color:var(--muted-2);pointer-events:none}.calc-block .calc-result-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.calc-block .calc-result{display:flex;align-items:baseline;gap:4px;font-variant-numeric:tabular-nums}.calc-block .calc-result .calc-label{font-size:13px;color:var(--muted);font-weight:600}.calc-block .calc-result strong{font-size:22px;font-weight:800;color:var(--primary)}.calc-block .calc-result .u{font-size:12px;color:var(--primary);margin-left:2px}.calc-block .calc-result .muted{color:var(--muted-2);font-size:18px}.calc-block .calc-apply{flex-shrink:0}.calc-block .calc-apply:disabled{background:#e5e7eb;color:var(--muted-2);cursor:not-allowed;box-shadow:none}.predict-hint{display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(135deg,var(--primary-soft) 0%,var(--accent-soft) 100%);border-radius:10px;font-size:13px}.predict-hint>i{color:var(--primary);font-size:16px}.predict-hint .hint-text{flex:1;color:var(--text)}.predict-hint .hint-text strong{color:var(--primary);font-weight:700}.predict-hint.predict-hint--inline .hint-text strong{font-weight:800;font-variant-numeric:tabular-nums}.sync-error{padding:10px 14px;background:var(--rose-soft);color:#991b1b;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:6px}.sync-success{padding:10px 14px;background:var(--mint-soft);color:#166534;border-radius:10px;font-size:13px;display:flex;align-items:center;gap:6px;animation:fadeIn .2s ease}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}.feeding-settings-dialog .feeding-settings-hint{margin:0 0 14px;font-size:13px;line-height:1.45}.feeding-settings-dialog .feeding-settings-hint code{font-size:11px;padding:1px 5px;border-radius:4px;background:#f1f5f9}.feeding-settings-dialog .feeding-settings-grid{grid-template-columns:1fr;gap:16px}.feeding-settings-dialog .field-hint{display:block;margin-top:8px;font-size:12px;line-height:1.4;padding:8px 12px;background:#f8fafc;border-radius:8px;border-left:3px solid #e2e8f0}.feeding-settings-dialog .label{position:relative}.feeding-settings-dialog .label code{font-size:11px;font-weight:600;color:var(--primary);background:var(--primary-soft);padding:2px 6px;border-radius:4px}.feeding-settings-dialog .label .notification-badge{display:inline-flex;align-items:center;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff;background:linear-gradient(135deg,#10b981,#059669);padding:2px 6px;border-radius:10px;margin-left:6px;box-shadow:0 1px 2px #10b98133;animation:gentle-pulse 2s ease-in-out infinite}.feeding-settings-dialog .notification-setting-field{position:relative}.feeding-settings-dialog .notification-setting-field input{border:1.5px solid #10b981;background:linear-gradient(to right,#fff,#f0fdf4)}.feeding-settings-dialog .notification-setting-field input:focus{border-color:#059669;box-shadow:0 0 0 3px #10b9811a;background:#fff}.feeding-settings-dialog .notification-setting-field input::placeholder{color:#6b7280;opacity:.7}.feeding-settings-dialog .notification-setting-field .field-hint{border-left-color:#10b981;background:linear-gradient(to right,#f0fdf4,#f8fafc)}@keyframes gentle-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.02)}}.log-time--with-badge,.feed-row-time .time--with-badge{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}.log-merge-badge,.feed-merge-badge{font:inherit;font-size:10px;font-weight:700;padding:2px 7px;border-radius:999px;border:1px solid rgba(99,102,241,.35);background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#312e81;cursor:pointer;line-height:1.2;white-space:nowrap}.log-merge-badge:hover,.feed-merge-badge:hover{filter:brightness(1.03)}.log-row--clickable,.feed-row--clickable{cursor:pointer}.log-row--clickable:hover,.feed-row--clickable:hover{background:#6366f10f}.log-row--clickable:focus-visible,.feed-row--clickable:focus-visible{outline:2px solid rgba(99,102,241,.45);outline-offset:2px}.dialog-overlay.dialog-overlay--front.feed-group-detail-overlay{z-index:125}.dialog-overlay.dialog-overlay--front.feed-detail-overlay{z-index:140;animation:overlayIn .12s ease-out}.dialog-overlay.dialog-overlay--front.feed-detail-overlay .feed-detail-dialog{animation:feedDetailIn .14s ease-out}@keyframes feedDetailIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.feed-detail-dialog{--fd-accent: 99, 102, 241;--fd-soft: #eef2ff;--fd-strong: #4338ca;max-width:min(400px,96vw);padding:0;overflow:hidden;display:flex;flex-direction:column}.feed-detail-dialog[data-status=low]{--fd-accent: 245, 158, 11;--fd-soft: #fffbeb;--fd-strong: #b45309}.feed-detail-dialog[data-status=high]{--fd-accent: 244, 63, 94;--fd-soft: #fff1f2;--fd-strong: #e11d48}.feed-detail-dialog[data-status=ok]{--fd-accent: 16, 185, 129;--fd-soft: #ecfdf5;--fd-strong: #059669}.feed-detail-top{position:relative;padding:20px 20px 16px;text-align:center;background:radial-gradient(120% 80% at 50% -20%,rgba(var(--fd-accent),.22),transparent 55%),linear-gradient(180deg,var(--fd-soft) 0%,#ffffff 72%);border-bottom:1px solid rgba(var(--fd-accent),.12)}.feed-detail-close{position:absolute;top:12px;right:12px;width:36px;height:36px;border:none;border-radius:50%;background:#ffffffd9;color:#64748b;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px #0f172a14;transition:background .15s ease,color .15s ease}.feed-detail-close:hover{background:#fff;color:#0f172a}.feed-detail-eyebrow{margin:0 0 6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b}.feed-detail-metric{display:flex;align-items:flex-end;justify-content:center;gap:4px;line-height:1;margin-bottom:10px}.feed-detail-metric__value{font-size:clamp(48px,14vw,56px);font-weight:800;letter-spacing:-.04em;color:var(--fd-strong);font-variant-numeric:tabular-nums}.feed-detail-metric__unit{font-size:18px;font-weight:700;color:rgba(var(--fd-accent),.85);padding-bottom:8px}.feed-detail-status{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700;background:#fff;border:1px solid rgba(var(--fd-accent),.28);color:var(--fd-strong);box-shadow:0 2px 6px rgba(var(--fd-accent),.1)}.feed-detail-status .pi{font-size:13px}.feed-detail-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px}.feed-detail-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:12px;background:#ffffffeb;border:1px solid #e2e8f0;font-size:12px;font-weight:600;color:#334155;line-height:1.3;box-shadow:0 1px 4px #0f172a0a}.feed-detail-chip .pi{font-size:13px;color:#6366f1;flex-shrink:0}.feed-detail-chip em{font-style:normal;font-weight:500;color:#94a3b8;margin-left:4px}.feed-detail-chip--time .pi{color:#dc2626}.feed-detail-chip--time span{font-variant-numeric:tabular-nums;font-weight:700;color:#dc2626}.feed-detail-chip--muted{background:#f8fafc;border-color:#e2e8f0;color:#64748b;font-weight:500}.feed-detail-chip--muted .pi{color:#94a3b8}.feed-detail-body{padding:16px 18px 8px;overflow-y:auto;flex:1;min-height:0}.feed-detail-section{margin-bottom:14px}.feed-detail-section:last-child{margin-bottom:0}.feed-detail-section__title{margin:0 0 10px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;display:flex;align-items:center;gap:7px}.feed-detail-section__title .pi{font-size:13px;color:#6366f1}.feed-detail-cards{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.feed-detail-card{display:flex;align-items:flex-start;gap:12px;padding:12px 13px;border-radius:14px;background:linear-gradient(180deg,#fafbff,#fff);border:1px solid #e2e8f0;box-shadow:0 2px 8px #0f172a0a}.feed-detail-card--warn,.feed-detail-card--gap.feed-detail-card--warn{border-color:#f59e0b66;background:linear-gradient(180deg,#fffbeb,#fff)}.feed-detail-card--warn .feed-detail-card__icon,.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__icon{background:#fef3c7;color:#b45309}.feed-detail-card--warn .feed-detail-card__text,.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__text{color:#92400e}.feed-detail-card--position{border-color:#8b5cf659;background:linear-gradient(180deg,#f5f3ff,#fff)}.feed-detail-card--average{border-color:#0ea5e959;background:linear-gradient(180deg,#f0f9ff,#fff)}.feed-detail-card--next{border-color:#10b98159;background:linear-gradient(180deg,#ecfdf5,#fff)}.feed-detail-card--gap:not(.feed-detail-card--warn){border-color:#64748b59;background:linear-gradient(180deg,#f8fafc,#fff)}.feed-detail-card__icon{flex-shrink:0;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#eef2ff;color:#4f46e5;font-size:15px}.feed-detail-card__icon[data-kind=position]{background:#ede9fe;color:#7c3aed}.feed-detail-card__icon[data-kind=average]{background:#e0f2fe;color:#0284c7}.feed-detail-card__icon[data-kind=next]{background:#d1fae5;color:#059669}.feed-detail-card__icon[data-kind=gap]{background:#e2e8f0;color:#475569}.feed-detail-card--gap.feed-detail-card--warn .feed-detail-card__icon{background:#fef3c7;color:#b45309}.feed-detail-card__body{min-width:0;flex:1}.feed-detail-card__label{display:block;font-size:11px;font-weight:800;color:#64748b;margin-bottom:3px;letter-spacing:.02em}.feed-detail-card__text{margin:0;font-size:13px;line-height:1.5;color:#0f172a}.fdc-position__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin-bottom:8px}.fdc-position__idx{font-size:18px;font-weight:800;color:#6d28d9;letter-spacing:-.02em}.fdc-position__of{font-size:14px;font-weight:700;color:#a78bfa}.fdc-position__tag{font-size:11px;font-weight:600;color:#64748b;padding:2px 8px;border-radius:999px;background:#8b5cf61a}.fdc-progress{height:8px;border-radius:999px;background:#ede9fe;overflow:hidden;margin-bottom:10px}.fdc-progress__fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#8b5cf6,#6366f1);transition:width .2s ease}.fdc-position__stats{display:flex;flex-wrap:wrap;gap:8px}.fdc-stat{display:inline-flex;align-items:baseline;gap:4px;padding:6px 10px;border-radius:10px;font-size:12px}.fdc-stat strong{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}.fdc-stat small{font-size:11px;font-weight:600;opacity:.85}.fdc-stat--violet{background:#f5f3ff;color:#5b21b6}.fdc-stat--violet strong{color:#6d28d9}.fdc-stat--indigo{background:#eef2ff;color:#4338ca}.fdc-stat--indigo strong{color:#4f46e5}.fdc-avg,.fdc-next{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}.fdc-pill{display:inline-flex;padding:4px 10px;border-radius:999px;font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}.fdc-pill--up{background:#dcfce7;color:#15803d}.fdc-pill--down{background:#fee2e2;color:#b91c1c}.fdc-pill--neutral{background:#f1f5f9;color:#475569}.fdc-avg__meta{font-size:12px;color:#64748b;line-height:1.4}.fdc-avg__meta strong{color:#0f172a;font-weight:700}.fdc-next__time{font-size:16px;font-weight:800;color:#dc2626;font-variant-numeric:tabular-nums}.fdc-next__vol{font-size:14px;font-weight:800;color:#059669;padding:4px 10px;border-radius:8px;background:#d1fae5}.fdc-next__gap{font-size:12px;font-weight:600;color:#64748b;display:inline-flex;align-items:center;gap:4px}.fdc-gap{display:flex;flex-direction:column;gap:10px}.fdc-gap__prev{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;padding:10px 12px;border-radius:10px;background:#ffffffe6;border:1px solid #e2e8f0}.fdc-gap__prev-label{font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b;width:100%}.fdc-gap__prev-time{font-size:17px;font-weight:800;color:#0f172a;font-variant-numeric:tabular-nums}.fdc-gap__prev-vol{font-size:14px;font-weight:800;color:#475569;padding:3px 8px;border-radius:8px;background:#f1f5f9}.fdc-gap__prev-date{font-size:11px;font-weight:600;color:#94a3b8}.fdc-gap__row{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;min-width:0}.fdc-gap__interval{display:inline-flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700;color:#475569;background:#e2e8f0;white-space:nowrap}.fdc-gap__interval .pi{font-size:13px;flex-shrink:0}.fdc-gap__interval span{overflow:hidden;text-overflow:ellipsis}.fdc-gap__interval--warn{color:#b45309;background:#fde68a;border:1px solid rgba(245,158,11,.35)}.fdc-gap__vol-diff{flex:0 0 auto;white-space:nowrap;font-size:12px;padding:5px 10px}.feed-detail-quote{margin:0;padding:12px 14px 12px 16px;border-radius:0;border-left:3px solid #c7d2fe;background:#f8fafc;font-size:14px;line-height:1.55;color:#334155;font-style:normal}.feed-detail-footer{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid #e2e8f0;background:#fafbff}.feed-detail-cta{display:flex;gap:8px;justify-content:stretch}.feed-detail-cta .btn{flex:1;justify-content:center}.feed-detail-cta .btn.primary{flex:1.2}.feed-group-detail-dialog .feed-group-detail-summary{margin:0 0 8px;padding:0 2px;font-size:13px;line-height:1.45}.feed-group-detail-dialog .feed-group-detail-hint{margin:0 0 12px;font-size:12px;line-height:1.4;display:flex;align-items:center;gap:6px}.feed-group-detail-dialog .feed-group-detail-history{margin-bottom:4px}.feed-group-detail-dialog .feed-group-detail-rows{max-height:min(58vh,420px);overflow-y:auto;padding-right:2px}.mom-food-card{--mf-tone: 244, 114, 182;--mf-soft: #fdf2f8;--mf-ring: #fbcfe8;--mf-strong: #db2777;position:relative;overflow:hidden;background:radial-gradient(900px 260px at 0% 0%,rgba(var(--mf-tone),.14),transparent 60%),#fff;border-color:rgba(var(--mf-tone),.22);padding:18px;margin-top:16px}.mom-food-card[data-accent=rose]{--mf-tone: 244, 63, 94;--mf-soft: #fff1f2;--mf-ring: #fecdd3;--mf-strong: #e11d48}.mom-food-card[data-accent=peach]{--mf-tone: 251, 146, 60;--mf-soft: #fff7ed;--mf-ring: #fed7aa;--mf-strong: #ea580c}.mom-food-card[data-accent=mint]{--mf-tone: 16, 185, 129;--mf-soft: #ecfdf5;--mf-ring: #a7f3d0;--mf-strong: #059669}.mom-food-card[data-accent=lavender]{--mf-tone: 139, 92, 246;--mf-soft: #f5f3ff;--mf-ring: #ddd6fe;--mf-strong: #7c3aed}.mom-food-card[data-accent=amber]{--mf-tone: 245, 158, 11;--mf-soft: #fffbeb;--mf-ring: #fde68a;--mf-strong: #d97706}.mf-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}.mf-head__lead{min-width:0;flex:1}.mf-head .eyebrow{display:inline-flex;align-items:center;gap:6px;color:var(--mf-strong);font-weight:700}.mf-head .eyebrow i{font-size:13px}.mf-head h2{margin:4px 0 0;font-size:18px;font-weight:800;color:var(--text);line-height:1.25}.mf-headline{margin:4px 0 0;font-size:13px;color:var(--mf-strong);font-weight:600}.mf-nav{display:inline-flex;align-items:center;gap:6px;background:var(--mf-soft);border-radius:999px;padding:4px;border:1px solid rgba(var(--mf-tone),.25);flex-shrink:0}.mf-arrow{width:30px;height:30px;border-radius:50%;border:none;background:#fff;color:var(--mf-strong);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease,background .15s ease}.mf-arrow i{font-size:12px}.mf-arrow:hover:not(:disabled){transform:scale(1.08);background:var(--mf-strong);color:#fff}.mf-arrow:disabled{opacity:.35;cursor:not-allowed}.mf-step{font-variant-numeric:tabular-nums;font-size:12px;color:var(--muted);padding:0 4px}.mf-step strong{color:var(--mf-strong);font-weight:800;font-size:13px}.mf-reset{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--mf-strong);background:transparent;border:1px dashed rgba(var(--mf-tone),.5);border-radius:999px;padding:4px 12px;cursor:pointer;margin-bottom:10px;transition:background .15s ease}.mf-reset:hover{background:var(--mf-soft)}.mf-reset i{font-size:11px}.mf-desc{margin:0 0 14px;font-size:13px;color:var(--muted);line-height:1.55}.mf-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}@media(max-width:640px){.mf-columns{grid-template-columns:1fr}}.mf-col{padding:12px 14px;border-radius:14px;background:#fff;border:1px solid #eef0f3}.mf-col--good{background:linear-gradient(180deg,#f0fdf4,#fff 80%);border-color:#bbf7d0}.mf-col--bad{background:linear-gradient(180deg,#fef2f2,#fff 80%);border-color:#fecaca}.mf-col-title{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:14px;font-weight:800;color:var(--text);letter-spacing:.01em}.mf-dot{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;flex-shrink:0;font-size:11px}.mf-dot i{font-size:10px}.mf-dot.good{background:#10b981;box-shadow:0 2px 6px #10b9814d}.mf-dot.bad{background:#ef4444;box-shadow:0 2px 6px #ef44444d}.mf-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.mf-item{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:10px;background:#ffffffb3;transition:background .15s ease,transform .15s ease}.mf-item:hover{background:#fff;transform:translate(2px)}.mf-item--bad .mf-name{color:#7f1d1d}.mf-item--good .mf-name{color:#064e3b}.mf-emoji{width:28px;height:28px;border-radius:8px;background:#fff;display:inline-grid;place-items:center;font-size:16px;flex-shrink:0;box-shadow:0 1px 2px #0f172a0f}.mf-emoji--x{background:#fef2f2;color:#ef4444}.mf-emoji--x i{font-size:12px}.mf-item-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.mf-name{font-size:13px;font-weight:700;color:var(--text);line-height:1.3}.mf-note{font-size:11.5px;color:var(--muted);line-height:1.35}.mf-tip{display:flex;align-items:flex-start;gap:8px;padding:10px 14px;border-radius:12px;background:var(--mf-soft);border:1px solid rgba(var(--mf-tone),.22);font-size:12.5px;color:var(--text);line-height:1.5}.mf-tip i{color:var(--mf-strong);font-size:15px;margin-top:1px;flex-shrink:0}.mom-tab .card{padding:12px 14px;margin-bottom:10px;border-radius:14px}.mom-tab .mom-wellness-section,.mom-tab .mom-tips-week{margin-bottom:10px}.mom-tab .mom-food-card{padding:12px 14px;margin-top:10px}.mom-tab .mf-head{margin-bottom:8px}.mom-tab .mf-head h2{font-size:16px}.mom-tab .mf-desc{margin-bottom:10px;font-size:12px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.mom-tab .mf-columns{gap:8px;margin-bottom:8px}.mom-tab .mf-col{padding:8px 10px}.mom-tab .mf-list{gap:6px}.mom-tab .mf-item{padding:6px 8px}.mom-tab .mf-tip{padding:8px 10px;font-size:12px}.mom-hero{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;margin-bottom:14px;background:linear-gradient(135deg,#fdf2f8,#faf5ff,#eef2ff);border:1px solid #f9a8d4;border-radius:16px}.mom-hero .mom-hero__icon{font-size:36px;line-height:1;flex-shrink:0}.mom-hero h2{margin:0 0 6px;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.02em}.mom-hero .mom-hero__sub{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}.mom-hero .mom-hero__sub strong{color:var(--text)}.mom-hero .mom-hero__sub .muted-inline{display:block;margin-top:4px;font-size:12.5px;opacity:.92}.mom-hero--compact{align-items:center;padding:10px 12px;margin-bottom:10px;border-radius:14px;gap:10px}.mom-hero--compact .mom-hero__icon{font-size:26px}.mom-hero--compact h2{margin:0;font-size:16px;letter-spacing:-.01em}.mom-hero--compact .mom-hero__title-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px}.mom-hero--compact .mom-hero__baby{font-size:12px;font-weight:700;color:#be185d;padding:2px 8px;border-radius:999px;background:#ffffffbf;border:1px solid rgba(244,114,182,.35)}.mom-hero--compact .mom-hero__sub{margin:4px 0 0;font-size:11.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mom-hero--compact .mom-hero__sub .muted-inline{display:inline;margin-top:0;font-size:11.5px}.section-head--tight{margin-bottom:8px}.section-head--tight h3{margin:0}.mom-disclaimer--compact{font-size:11px;line-height:1.4;padding:8px 10px;margin-top:4px;margin-bottom:6px}.section-head{margin-bottom:14px}.section-head h3{margin:0 0 6px;font-size:16px;font-weight:800;display:flex;align-items:center;gap:8px;color:var(--text)}.section-head h3 i{color:#db2777;font-size:15px}.section-head .section-sub{margin:0;font-size:12.5px;color:var(--muted);line-height:1.45}.mom-wellness-section{margin-bottom:16px}.mom-tab .mom-wellness-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}.mom-wellness-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.mom-w-card{padding:14px 14px 12px;border-radius:14px;border:1px solid var(--border);background:#fafafa;transition:border-color .15s,box-shadow .15s}.mom-w-card:hover{border-color:#f472b6;box-shadow:0 6px 18px -12px #db277759}.mom-w-card .mom-w-card__icon{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#fce7f3,#ede9fe);display:flex;align-items:center;justify-content:center;margin-bottom:10px}.mom-w-card .mom-w-card__icon i{font-size:16px;color:#be185d}.mom-w-card h4{margin:0 0 8px;font-size:13.5px;font-weight:800;color:var(--text);line-height:1.3}.mom-w-card p{margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}.mom-tips-week{margin-bottom:16px}.mom-tab .mom-tips-list{gap:6px}.mom-tab .mom-tips-list li{padding:8px 10px;border-radius:10px}.mom-tab .mom-tips-list li strong{margin-bottom:2px;font-size:12px}.mom-tab .mom-tips-list li span{font-size:11.5px;line-height:1.4}.mom-tips-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.mom-tips-list li{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:#fefce8;border:1px solid #fde047}.mom-tips-list li>i{color:#ca8a04;margin-top:2px;flex-shrink:0}.mom-tips-list li strong{display:block;font-size:13px;font-weight:800;color:var(--text);margin-bottom:4px}.mom-tips-list li span{font-size:12.5px;line-height:1.5;color:var(--muted)}.mom-disclaimer{margin-top:8px;margin-bottom:8px}.mom-empty-profile{max-width:520px;margin:24px auto 40px;text-align:center}.mom-empty-profile__inner{padding:28px 22px}.mom-empty-profile__inner .mom-empty-emoji{font-size:48px;display:block;margin-bottom:12px}.mom-empty-profile__inner h2{margin:0 0 10px;font-size:17px;font-weight:800;color:var(--text)}.mom-empty-profile__inner p{margin:0 0 18px;font-size:14px;line-height:1.55;color:var(--muted)}.event-reminder-dialog{max-width:min(520px,100vw - 28px);padding-bottom:8px}.event-reminder-dialog__head{align-items:flex-start;margin-bottom:4px}.event-reminder-dialog__title{margin:0;padding-right:40px;font-size:20px;font-weight:800;line-height:1.3;color:var(--text, #0f172a);display:flex;align-items:center;gap:10px;letter-spacing:-.02em}.event-reminder-dialog__title .pi-bell{color:#f59e0b;font-size:18px;flex-shrink:0}.event-reminder-list{list-style:none;margin:12px 0 0;padding:0;max-height:min(52vh,400px);overflow:auto;display:flex;flex-direction:column;gap:10px}.event-reminder-card{padding:14px 16px;background:linear-gradient(180deg,#fafbff,#fff);border:1px solid #e2e8f0;border-radius:14px;box-shadow:0 2px 8px #0f172a0d}.event-reminder-card__title{margin:0;font-size:16px;font-weight:800;color:var(--text, #0f172a);line-height:1.35}.event-reminder-card__datetime{margin:5px 0 0;font-size:12.5px;font-weight:500;color:#64748b;line-height:1.4}.event-reminder-card__date{color:#475569;font-weight:600}.event-reminder-card__sep{color:#94a3b8}.event-reminder-card__hour{color:#dc2626;font-weight:700;font-variant-numeric:tabular-nums}.event-reminder-card__place{margin:6px 0 0;display:flex;align-items:flex-start;gap:6px;font-size:13px;color:#475569;line-height:1.4}.event-reminder-card__place .pi-map-marker{margin-top:2px;flex-shrink:0;font-size:13px;color:var(--primary, #5b6cff)}.event-reminder-card__content-wrap{margin-top:10px;padding-top:10px;border-top:1px solid #eef1f6}.event-reminder-card__content-label{display:block;margin-bottom:4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#94a3b8}.event-reminder-card__content{margin:0;font-size:13.5px;color:#334155;line-height:1.5;white-space:pre-wrap}.event-reminder-actions{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border, #e5e7eb)}.event-reminder-actions__link{flex:0 1 auto;min-width:0;padding:6px 4px;border:none;background:transparent;color:#64748b;font-size:13px;font-weight:600;font-family:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.event-reminder-actions__link:hover:not(:disabled){color:#334155}.event-reminder-actions__link:disabled{opacity:.5;cursor:not-allowed}.event-reminder-actions__primary{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;font-size:15px;font-weight:700;text-align:center}\n"] }]
|
|
15581
15848
|
}], ctorParameters: () => [], propDecorators: { feedingPageRef: [{
|
|
15582
15849
|
type: ViewChild,
|
|
15583
15850
|
args: ['feedingPage', { static: true }]
|
|
@@ -15590,6 +15857,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImpo
|
|
|
15590
15857
|
}], weightCmp: [{
|
|
15591
15858
|
type: ViewChild,
|
|
15592
15859
|
args: [WeightComponent]
|
|
15860
|
+
}], feedingDialogs: [{
|
|
15861
|
+
type: ViewChild,
|
|
15862
|
+
args: ['feedingDialogs']
|
|
15593
15863
|
}] } });
|
|
15594
15864
|
|
|
15595
15865
|
/*
|