/* DaCucina — unified local calendar (Google-Calendar-style), 2026-09-28.
   One surface for day / week / month. Tokens fall back to the app theme; the calendar surface itself is white like Google. */
.cp, #gcal-popup-host, #modal-container .cpf-system, #modal-container .cpf-confirm { --cp-font: 'Heebo', 'Assistant', system-ui, sans-serif; --cp-surface: #ffffff; --cp-line: #e3e6ea; --cp-line-soft: #eef0f3; --cp-text: #1f1f1f; --cp-muted: #5f6368; --cp-faint: #80868b; --cp-today: #1a73e8; --cp-now: #ea4335; --cp-accent: var(--accent-primary, #b88857); --cp-hover: rgba(60, 64, 67, .08); --cp-radius: 8px; --cp-hour: 48px; --cp-gutter: 56px;
  font-family: var(--cp-font); color: var(--cp-text); direction: rtl; }
body.dark .cp, body.dark #gcal-popup-host, body.dark #modal-container .cpf-system, body.dark #modal-container .cpf-confirm { --cp-surface: #1b1f2a; --cp-line: rgba(255, 255, 255, .12); --cp-line-soft: rgba(255, 255, 255, .07); --cp-text: #f1f1f1; --cp-muted: #b8bcc4; --cp-faint: #8d929b; --cp-hover: rgba(255, 255, 255, .08); }
.cp * { box-sizing: border-box; }
.cp button { font-family: inherit; }
.cp bdi, .cp .ltr { direction: ltr; unicode-bidi: isolate; }

/* ---------- toolbar (the ONE navigation bar) ---------- */
.cp-toolbar { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .6rem .9rem; background: var(--cp-surface); border: 1px solid var(--cp-line); border-radius: 12px; margin-bottom: .75rem; position: relative; z-index: 6; }
.cp-create { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem 1rem .55rem .8rem; border-radius: 999px; border: 1px solid var(--cp-line); background: var(--cp-surface); color: var(--cp-text); font-weight: 600; font-size: 13.5px; cursor: pointer; box-shadow: 0 1px 3px rgba(60, 64, 67, .2); transition: box-shadow .15s, background .15s; }
.cp-create:hover { box-shadow: 0 2px 6px rgba(60, 64, 67, .3); background: #f8f9fa; }
.cp-create i { font-size: 20px; color: var(--cp-accent); }
.cp-today { padding: .45rem .9rem; border-radius: 6px; border: 1px solid var(--cp-line); background: var(--cp-surface); color: var(--cp-text); font-size: 13px; font-weight: 500; cursor: pointer; }
.cp-today:hover, .cp-nav:hover, .cp-seg button:hover, .cp-pick-btn:hover { background: var(--cp-hover); }
.cp-nav { width: 34px; height: 34px; border-radius: 50%; border: none; background: transparent; color: var(--cp-muted); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; font-size: 18px; }
.cp-title { font-size: 20px; font-weight: 500; color: var(--cp-text); margin: 0 .35rem; white-space: nowrap; }
.cp-title small { font-size: 12.5px; color: var(--cp-muted); font-weight: 400; margin-inline-start: .4rem; }
.cp-spacer { flex: 1; }
.cp-seg { display: inline-flex; border: 1px solid var(--cp-line); border-radius: 6px; overflow: hidden; }
.cp-seg button { border: none; background: transparent; color: var(--cp-text); padding: .45rem .8rem; font-size: 13px; cursor: pointer; }
.cp-seg button + button { border-inline-start: 1px solid var(--cp-line); }
.cp-seg button.on { background: #e8f0fe; color: #1967d2; font-weight: 600; }
body.dark .cp-seg button.on { background: rgba(138, 180, 248, .2); color: #8ab4f8; }
.cp-seg.small button { padding: .32rem .6rem; font-size: 12px; }
.cp-custom { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--cp-muted); }
.cp-custom input { width: 48px; padding: 3px 5px; border: 1px solid var(--cp-line); border-radius: 5px; background: var(--cp-surface); color: var(--cp-text); font: inherit; }
.cp-pick { position: relative; }
.cp-pick-btn { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .8rem; border-radius: 6px; border: 1px solid var(--cp-line); background: var(--cp-surface); color: var(--cp-text); font-size: 13px; cursor: pointer; }
.cp-pick-menu { display: none; position: absolute; top: 112%; inset-inline-start: 0; z-index: 60; background: var(--cp-surface); border: 1px solid var(--cp-line); border-radius: 10px; padding: .5rem; min-width: 300px; max-height: 420px; overflow: auto; box-shadow: 0 8px 28px rgba(0, 0, 0, .18); }
.cp-pick-menu.on { display: block; }
.cp-pick-row { display: flex; align-items: center; gap: .5rem; padding: .35rem .4rem; border-radius: 6px; cursor: pointer; font-size: 12.5px; }
.cp-pick-row:hover { background: var(--cp-hover); }
.cp-pick-row .sw { width: 12px; height: 12px; border-radius: 3px; flex-shrink: 0; }
.cp-pick-row .nm { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cp-pick-row .ro { font-size: 10.5px; color: var(--cp-faint); }
.cp-pick-group { font-size: 11px; font-weight: 700; color: var(--cp-muted); margin: .4rem 0 .2rem; }
.cp-pick-actions { display: flex; gap: .3rem; flex-wrap: wrap; margin-bottom: .4rem; }
.cp-pick-actions button { border: 1px solid var(--cp-line); background: transparent; color: var(--cp-text); border-radius: 6px; padding: .25rem .55rem; font-size: 11.5px; cursor: pointer; }
.cp-ext { display: inline-flex; align-items: center; gap: .35rem; font-size: 12.5px; color: var(--cp-muted); text-decoration: none; padding: .4rem .6rem; border-radius: 6px; }
.cp-ext:hover { background: var(--cp-hover); color: var(--cp-text); }
.cp-status { display: inline-flex; align-items: center; gap: .35rem; font-size: 11.5px; color: var(--cp-muted); padding: .3rem .6rem; border-radius: 999px; border: 1px solid var(--cp-line); }
.cp-status .d { width: 7px; height: 7px; border-radius: 50%; background: #9aa0a6; }
.cp-status.ok .d { background: #34a853; } .cp-status.err .d { background: var(--cp-now); } .cp-status.load .d { background: #fbbc04; }

/* ---------- shell: aside + main ---------- */
.cp-shell { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: .75rem; align-items: start; }
@media (max-width: 980px) { .cp-shell { grid-template-columns: 1fr; } .cp-aside { order: 2; } }
.cp-aside { display: flex; flex-direction: column; gap: .75rem; }
.cp-card { background: var(--cp-surface); border: 1px solid var(--cp-line); border-radius: 12px; }
.cp-mini { padding: .6rem .7rem; }
.cp-mini-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .3rem; font-size: 13px; font-weight: 600; }
.cp-mini-head button { width: 24px; height: 24px; border: none; background: transparent; border-radius: 50%; cursor: pointer; color: var(--cp-muted); }
.cp-mini-head button:hover { background: var(--cp-hover); }
.cp-mini-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; }
.cp-mini-dow { font-size: 10px; color: var(--cp-faint); text-align: center; padding: 2px 0; }
.cp-mini-day { aspect-ratio: 1; border: none; background: transparent; color: var(--cp-text); font-size: 11px; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.cp-mini-day:hover { background: var(--cp-hover); }
.cp-mini-day.out { color: var(--cp-faint); }
.cp-mini-day.today { background: var(--cp-today); color: #fff; font-weight: 700; }
.cp-mini-day.sel:not(.today) { background: #e8f0fe; color: #1967d2; font-weight: 600; }
.cp-mini-day.inrange:not(.sel):not(.today) { background: rgba(26, 115, 232, .08); }
.cp-list { padding: .6rem .7rem; }
.cp-list-title { font-size: 12.5px; font-weight: 700; margin-bottom: .4rem; display: flex; align-items: center; gap: .4rem; }
.cp-list-body { display: flex; flex-direction: column; max-height: 320px; overflow: auto; }
.cp-adv summary { cursor: pointer; font-size: 12px; color: var(--cp-muted); padding: .5rem .7rem; }
.cp-adv-body { padding: 0 .7rem .6rem; display: flex; flex-direction: column; gap: .35rem; font-size: 12px; }
.cp-adv-body button, .cp-adv-body a { text-align: right; border: 1px solid var(--cp-line); background: transparent; color: var(--cp-text); border-radius: 6px; padding: .35rem .6rem; font-size: 12px; cursor: pointer; text-decoration: none; }
.cp-adv-body table { width: 100%; font-size: 10.5px; border-collapse: collapse; } .cp-adv-body td { padding: 1px 4px; }

/* ---------- banners ---------- */
.cp-banner { display: flex; align-items: center; gap: .6rem; padding: .55rem .9rem; border-radius: 10px; font-size: 12.5px; margin-bottom: .6rem; border: 1px solid; }
.cp-banner.err { background: #fce8e6; color: #c5221f; border-color: #f5c6c4; }
.cp-banner.warn { background: #fef7e0; color: #b06000; border-color: #fde68a; }
.cp-banner.info { background: #e8f0fe; color: #174ea6; border-color: #c6dafc; }
body.dark .cp-banner.err { background: rgba(234, 67, 53, .15); color: #f28b82; } body.dark .cp-banner.warn { background: rgba(251, 188, 4, .12); color: #fdd663; } body.dark .cp-banner.info { background: rgba(26, 115, 232, .15); color: #8ab4f8; }
.cp-banner span { flex: 1; }
.cp-banner button { border: 1px solid currentColor; background: transparent; color: inherit; border-radius: 6px; padding: .25rem .6rem; font-size: 11.5px; cursor: pointer; }

/* ---------- time grids (day + week) ---------- */
.cp-grid { position: relative; overflow: auto; max-height: calc(100vh - 210px); min-height: 420px; background: var(--cp-surface); border-radius: 12px; }
.cp-grid.loading { opacity: .6; pointer-events: none; }
.cp-head { display: flex; position: sticky; top: 0; z-index: 4; background: var(--cp-surface); border-bottom: 1px solid var(--cp-line); }
.cp-head .cp-gut, .cp-allday .cp-gut, .cp-body .cp-gut { width: var(--cp-gutter); flex-shrink: 0; position: sticky; inset-inline-start: 0; background: var(--cp-surface); z-index: 3; border-inline-end: 1px solid var(--cp-line); }
.cp-hcell { flex: 1; min-width: var(--cp-colmin, 150px); padding: .45rem .5rem .35rem; border-inline-end: 1px solid var(--cp-line-soft); display: flex; align-items: center; gap: .5rem; min-height: 54px; }
.cp-hcell .av { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0; }
.cp-hcell .nm { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cp-hcell .sub { font-size: 10.5px; color: var(--cp-faint); }
.cp-hcell.day { flex-direction: column; gap: 2px; justify-content: center; text-align: center; cursor: pointer; }
.cp-hcell.day .dw { font-size: 11px; color: var(--cp-muted); text-transform: uppercase; letter-spacing: .3px; }
.cp-hcell.day .dn { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 400; color: var(--cp-text); }
.cp-hcell.day.today .dw { color: var(--cp-today); font-weight: 700; }
.cp-hcell.day.today .dn { background: var(--cp-today); color: #fff; font-weight: 500; }
.cp-hcell.day:hover .dn:not(.today) { background: var(--cp-hover); }
.cp-allday { display: flex; border-bottom: 1px solid var(--cp-line); min-height: 26px; position: sticky; top: 55px; z-index: 3; background: var(--cp-surface); }
.cp-allday .cp-gut { font-size: 10px; color: var(--cp-faint); display: flex; align-items: flex-end; justify-content: center; padding-bottom: 3px; }
.cp-adcell { flex: 1; min-width: var(--cp-colmin, 150px); border-inline-end: 1px solid var(--cp-line-soft); padding: 2px 3px; display: flex; flex-direction: column; gap: 2px; }
.cp-body { display: flex; position: relative; }
.cp-body .cp-gut { position: sticky; inset-inline-start: 0; z-index: 2; }
.cp-hour { position: absolute; inset-inline-end: 6px; transform: translateY(-50%); font-size: 10.5px; color: var(--cp-faint); }
.cp-col { flex: 1; min-width: var(--cp-colmin, 150px); position: relative; border-inline-end: 1px solid var(--cp-line-soft); cursor: pointer; background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--cp-hour) - 1px), var(--cp-line-soft) calc(var(--cp-hour) - 1px), var(--cp-line-soft) var(--cp-hour)); }
.cp-col.today { background-color: rgba(26, 115, 232, .025); }
.cp-col.ro { cursor: default; }
.cp-halfline { position: absolute; left: 0; right: 0; height: 1px; border-top: 1px dashed var(--cp-line-soft); pointer-events: none; }
.cp-now { position: absolute; left: 0; right: 0; height: 2px; background: var(--cp-now); z-index: 5; pointer-events: none; }
.cp-now::before { content: ''; position: absolute; inset-inline-start: -5px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--cp-now); }
.cp-sel { position: absolute; left: 3px; right: 3px; background: rgba(26, 115, 232, .18); border: 1px solid var(--cp-today); border-radius: 6px; z-index: 6; pointer-events: none; font-size: 11px; color: #174ea6; padding: 2px 6px; }

/* event cards */
.cp-ev { position: absolute; border-radius: 6px; padding: 3px 6px 3px 4px; font-size: 12px; line-height: 1.25; overflow: hidden; cursor: pointer; box-shadow: 0 1px 2px rgba(0, 0, 0, .18); border-inline-start: 4px solid rgba(0, 0, 0, .18); user-select: none; transition: box-shadow .12s, transform .12s; }
.cp-ev:hover { box-shadow: 0 3px 8px rgba(0, 0, 0, .28); z-index: 7 !important; }
.cp-ev:focus-visible { outline: 2px solid var(--cp-today); outline-offset: 1px; z-index: 7 !important; }
.cp-ev .t { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-ev .m { font-size: 11px; opacity: .9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-ev .who { font-size: 10.5px; opacity: .85; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-ev.short { padding-top: 1px; padding-bottom: 1px; line-height: 1.1; }
.cp-ev.short .m, .cp-ev.short .who { display: none; }
.cp-ev.unsynced { border: 1px dashed currentColor; background-image: repeating-linear-gradient(45deg, transparent 0 6px, rgba(255, 255, 255, .18) 6px 12px); }
.cp-ev.ro { cursor: default; }
.cp-ev.dragging { opacity: .55; }
.cp-ev .rz { position: absolute; left: 0; right: 0; bottom: 0; height: 7px; cursor: ns-resize; }
.cp-ev.ro .rz { display: none; }
.cp-ghost { position: absolute; border-radius: 6px; border: 2px dashed var(--cp-today); background: rgba(26, 115, 232, .15); z-index: 8; pointer-events: none; font-size: 11px; color: #174ea6; padding: 2px 6px; white-space: nowrap; overflow: hidden; }
.cp-chip { display: block; border-radius: 4px; padding: 1px 6px; font-size: 11.5px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.cp-chip:hover { filter: brightness(.95); }
.cp-chip.unsynced { border: 1px dashed currentColor; }

/* ---------- month ---------- */
.cp-month { background: var(--cp-surface); border-radius: 12px; overflow: hidden; }
.cp-month.loading { opacity: .6; pointer-events: none; }
.cp-mrow-head { display: grid; grid-template-columns: repeat(7, 1fr); border-bottom: 1px solid var(--cp-line); }
.cp-mrow-head div { text-align: center; font-size: 11px; color: var(--cp-muted); padding: .45rem 0; text-transform: uppercase; }
.cp-mrow { display: grid; grid-template-columns: repeat(7, 1fr); border-bottom: 1px solid var(--cp-line-soft); min-height: 108px; position: relative; }
.cp-mrow:last-child { border-bottom: none; }
.cp-mcell { border-inline-end: 1px solid var(--cp-line-soft); padding: 3px 3px 4px; min-width: 0; cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.cp-mcell:last-child { border-inline-end: none; }
.cp-mcell:hover { background: rgba(60, 64, 67, .04); }
.cp-mcell.out { background: rgba(60, 64, 67, .025); }
.cp-mcell.out .dn { color: var(--cp-faint); }
.cp-mcell .dn { align-self: center; width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12.5px; cursor: pointer; margin-bottom: 1px; }
.cp-mcell .dn:hover { background: var(--cp-hover); }
.cp-mcell.today .dn { background: var(--cp-today); color: #fff; font-weight: 700; }
.cp-mcell .spans { height: calc(var(--cp-spanrows, 0) * 20px); }
.cp-mcell .more { font-size: 11px; color: var(--cp-muted); padding: 0 6px; cursor: pointer; border-radius: 4px; }
.cp-mcell .more:hover { background: var(--cp-hover); }
.cp-chip.timed { background: transparent !important; color: var(--cp-text) !important; display: flex; align-items: center; gap: 4px; }
.cp-chip.timed .dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.cp-chip.timed .tm { color: var(--cp-muted); font-size: 11px; flex-shrink: 0; }
.cp-chip.timed .tt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cp-span { position: absolute; height: 18px; border-radius: 4px; font-size: 11px; line-height: 18px; padding: 0 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; z-index: 2; }
.cp-span.cont-start { border-start-start-radius: 0; border-end-start-radius: 0; }
.cp-span.cont-end { border-start-end-radius: 0; border-end-end-radius: 0; }

/* ---------- popovers ---------- */
.cp-pop-overlay { position: fixed; inset: 0; z-index: 1000; background: rgba(0, 0, 0, .28); display: flex; align-items: center; justify-content: center; }
.cp-pop { background: var(--cp-surface); color: var(--cp-text); border-radius: 12px; width: min(480px, 94vw); max-height: 88vh; overflow: auto; box-shadow: 0 14px 44px rgba(0, 0, 0, .3); font-family: var(--cp-font); direction: rtl; }
.cp-pop-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px 8px; }
.cp-pop-head .sw { width: 16px; height: 16px; border-radius: 4px; flex-shrink: 0; }
.cp-pop-head h3 { margin: 0; flex: 1; font-size: 17px; font-weight: 500; line-height: 1.3; word-break: break-word; }
.cp-pop-head .x { border: none; background: transparent; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; color: var(--cp-muted); font-size: 18px; }
.cp-pop-head .x:hover { background: var(--cp-hover); }
.cp-pop-body { padding: 4px 14px 12px; display: flex; flex-direction: column; gap: 7px; font-size: 13px; }
.cp-row { display: flex; gap: 10px; align-items: flex-start; }
.cp-row i { color: var(--cp-muted); margin-top: 2px; width: 18px; text-align: center; flex-shrink: 0; }
.cp-row div { flex: 1; min-width: 0; word-break: break-word; }
.cp-tag { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px; font-size: 11px; border: 1px solid var(--cp-line); color: var(--cp-muted); }
.cp-tag.ok { color: #188038; border-color: #a8dab5; background: #e6f4ea; } .cp-tag.warn { color: #b06000; border-color: #fde68a; background: #fef7e0; } .cp-tag.err { color: #c5221f; border-color: #f5c6c4; background: #fce8e6; }
.cp-linkbox { border: 1px solid var(--cp-line); border-radius: 8px; padding: 8px 10px; background: rgba(60, 64, 67, .04); }
.cp-pop-foot { display: flex; gap: 6px; padding: 8px 12px 12px; flex-wrap: wrap; justify-content: flex-end; }
.cp-btn { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--cp-line); background: var(--cp-surface); color: var(--cp-text); border-radius: 6px; padding: .45rem .8rem; font-size: 12.5px; font-weight: 500; cursor: pointer; text-decoration: none; }
.cp-btn:hover { background: var(--cp-hover); }
.cp-btn.primary { background: #1a73e8; color: #fff; border-color: #1a73e8; } .cp-btn.primary:hover { background: #1765cc; }
.cp-btn.danger { color: #c5221f; } .cp-btn:disabled { opacity: .5; cursor: not-allowed; }
.cp-confirm-diff { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; font-size: 13px; background: rgba(60, 64, 67, .04); border-radius: 8px; padding: 8px 10px; }
.cp-confirm-diff .k { color: var(--cp-muted); }
.cp-daylist { display: flex; flex-direction: column; gap: 3px; }

/* ---------- misc ---------- */
.cp-empty { padding: 2.4rem 1rem; text-align: center; color: var(--cp-muted); font-size: 13px; }
.cp-empty i { font-size: 40px; color: var(--cp-faint); display: block; margin-bottom: .5rem; }
.cp-skel { height: 420px; background: linear-gradient(90deg, rgba(60, 64, 67, .06) 25%, rgba(60, 64, 67, .12) 37%, rgba(60, 64, 67, .06) 63%); background-size: 400% 100%; animation: cp-shimmer 1.4s ease infinite; border-radius: 12px; }
@keyframes cp-shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
.cp-legend { display: flex; gap: .5rem; flex-wrap: wrap; font-size: 11px; color: var(--cp-muted); padding: .4rem .2rem 0; align-items: center; }
.cp-legend .sw { width: 10px; height: 10px; border-radius: 3px; display: inline-block; margin-inline-end: 3px; vertical-align: middle; }
@media (prefers-reduced-motion: reduce) { .cp-skel { animation: none; } .cp-ev, .cp-create { transition: none; } }
@media (max-width: 760px) { .cp-title { font-size: 16px; } .cp-toolbar { padding: .5rem .6rem; gap: .4rem; } .cp-hcell.day .dn { width: 32px; height: 32px; font-size: 17px; } .cp { --cp-gutter: 44px; } }

/* ---------- round 2 (2026-09-28): opaque dialogs, scrolling body, focus ring ---------- */
.cp-pop-overlay { background: rgba(32, 33, 36, .55); padding: 12px; }
.cp-pop { background: #ffffff; display: flex; flex-direction: column; max-height: min(88vh, 100%); isolation: isolate; }
body.dark .cp-pop { background: #1b1f2a; }
.cp-pop-head { flex-shrink: 0; }
.cp-pop-body { flex: 1 1 auto; min-height: 0; overflow: auto; }
.cp-pop-foot { flex-shrink: 0; border-top: 1px solid var(--cp-line); }
.cp-ev:focus-visible, .cp-chip:focus-visible, .cp-span:focus-visible { outline: 2px solid #1a73e8; outline-offset: 1px; }
/* ---------- design layer for the EXISTING meeting forms (same ids, same save logic) ---------- */
#gcal-popup-host .cpf { position: fixed; inset: 0; z-index: 1000; background: rgba(32, 33, 36, .55); display: flex; align-items: center; justify-content: center; padding: 12px; }
.cpf-modal { background: #ffffff; color: var(--cp-text); border-radius: 14px; width: min(600px, 100%); max-height: min(92vh, 100%); display: flex; flex-direction: column; box-shadow: 0 16px 48px rgba(0, 0, 0, .32); font-family: var(--cp-font); direction: rtl; isolation: isolate; }
body.dark .cpf-modal { background: #1b1f2a; }
.cpf-head { display: flex; align-items: center; gap: 8px; padding: 14px 18px 10px; flex-shrink: 0; }
.cpf-head h3 { margin: 0; flex: 1; font-size: 18px; font-weight: 500; color: var(--cp-text); }
.cpf-head .btn-icon { border: none; background: transparent; width: 32px; height: 32px; border-radius: 50%; cursor: pointer; color: var(--cp-muted); font-size: 18px; display: inline-flex; align-items: center; justify-content: center; }
.cpf-head .btn-icon:hover { background: var(--cp-hover); }
.cpf-body { padding: 4px 18px 14px; overflow: auto; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 12px; font-size: 13px; color: var(--cp-text); }
.cpf-body > div[style*="display:flex"] { gap: 10px !important; }
.cpf-body > div[style*="display:flex"] > label { flex: 1; }
.cpf-foot { display: flex; gap: 8px; padding: 10px 18px 14px; justify-content: flex-end; border-top: 1px solid var(--cp-line); flex-wrap: wrap; flex-shrink: 0; }
.cpf-modal label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--cp-muted); font-weight: 500; }
.cpf-modal label > span[style] { color: #c5221f; }
.cpf-modal input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), .cpf-modal select, .cpf-modal textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--cp-line); border-radius: 8px; background: #fff; color: var(--cp-text); font: inherit; font-size: 13.5px; line-height: 1.3; }
body.dark .cpf-modal input:not([type="checkbox"]), body.dark .cpf-modal select, body.dark .cpf-modal textarea { background: #161922; }
.cpf-modal input:focus, .cpf-modal select:focus, .cpf-modal textarea:focus { outline: none; border-color: #1a73e8; box-shadow: 0 0 0 3px rgba(26, 115, 232, .2); }
.cpf-modal input[disabled] { background: #f1f3f4; color: var(--cp-muted); }
.cpf-modal input[type="date"], .cpf-modal input[type="time"], .cpf-modal input[type="tel"], .cpf-modal input[type="email"] { direction: ltr; text-align: right; }
.cpf-modal .btn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--cp-line); background: #fff; color: var(--cp-text); border-radius: 8px; padding: .5rem .9rem; font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; }
.cpf-modal .btn:hover { background: var(--cp-hover); }
.cpf-modal .btn-primary { background: #1a73e8; border-color: #1a73e8; color: #fff; } .cpf-modal .btn-primary:hover { background: #1765cc; }
.cpf-modal .btn-danger { color: #c5221f; border-color: #f5c6c4; background: #fff; } .cpf-modal .btn-danger:hover { background: #fce8e6; }
.cpf-modal .btn-sm { padding: .3rem .6rem; font-size: 12px; }
.cpf-modal .btn[disabled] { opacity: .55; cursor: not-allowed; }
.cpf-modal [id$="Section"] { border: 1px solid var(--cp-line) !important; background: #f8f9fa !important; border-radius: 10px !important; padding: 10px 12px !important; }
body.dark .cpf-modal [id$="Section"] { background: #161922 !important; }
.cpf-modal [id$="Results"] > div { padding: 6px 8px; border-radius: 6px; cursor: pointer; }
.cpf-modal [id$="Results"] > div:hover { background: var(--cp-hover); }
.cpf-summary { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; background: #e8f0fe; color: #174ea6; border-radius: 10px; padding: 10px 12px; font-size: 13px; }
.cpf-summary i { font-size: 16px; }
.cpf-summary strong { font-weight: 600; }
body.dark .cpf-summary { background: rgba(26, 115, 232, .18); color: #8ab4f8; }
/* the system meeting form (#modal-container .modal) and the app confirm, same language */
#modal-container .modal.cpf-system, #modal-container .modal.cpf-confirm { background: #ffffff; color: var(--cp-text); border-radius: 14px; font-family: var(--cp-font); box-shadow: 0 16px 48px rgba(0, 0, 0, .32); max-height: 92vh; display: flex; flex-direction: column; }
body.dark #modal-container .modal.cpf-system, body.dark #modal-container .modal.cpf-confirm { background: #1b1f2a; }
#modal-container .cpf-system .modal-header, #modal-container .cpf-confirm .modal-header { padding: 14px 18px 10px; border: none; flex-shrink: 0; }
#modal-container .cpf-system .modal-header h3, #modal-container .cpf-confirm .modal-header h3 { font-size: 18px; font-weight: 500; margin: 0; }
#modal-container .cpf-system .modal-body { padding: 4px 18px 14px; overflow: auto; flex: 1 1 auto; min-height: 0; }
#modal-container .cpf-system .modal-footer, #modal-container .cpf-confirm .modal-footer { border-top: 1px solid var(--cp-line); padding: 10px 18px 14px; display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; flex-shrink: 0; }
#modal-container .cpf-system label { font-size: 12px !important; color: var(--cp-muted) !important; font-weight: 500 !important; margin-bottom: 4px; }
#modal-container .cpf-system input:not([type="hidden"]), #modal-container .cpf-system select, #modal-container .cpf-system textarea { width: 100%; padding: 9px 11px !important; border: 1px solid var(--cp-line) !important; border-radius: 8px !important; background: #fff !important; color: var(--cp-text) !important; font: inherit; font-size: 13.5px !important; }
body.dark #modal-container .cpf-system input, body.dark #modal-container .cpf-system select, body.dark #modal-container .cpf-system textarea { background: #161922 !important; }
#modal-container .cpf-system input:focus, #modal-container .cpf-system select:focus, #modal-container .cpf-system textarea:focus { outline: none; border-color: #1a73e8 !important; box-shadow: 0 0 0 3px rgba(26, 115, 232, .2); }
#modal-container .cpf-system input[type="date"] { direction: ltr; text-align: right; }
#modal-container .cpf-system .btn, #modal-container .cpf-confirm .btn { border-radius: 8px; font-family: var(--cp-font); font-size: 13px; padding: .5rem .9rem; }
#modal-container .cpf-system .btn-primary, #modal-container .cpf-confirm .btn-primary { background: #1a73e8 !important; border-color: #1a73e8 !important; color: #fff !important; }
#modal-container .cpf-system #ev_lead_results { border: 1px solid var(--cp-line) !important; border-radius: 10px !important; background: #fff !important; box-shadow: 0 8px 24px rgba(0, 0, 0, .16); }
@media (max-width: 600px) { .cp-pop, .cpf-modal { width: 100%; max-height: 100%; border-radius: 12px; } .cpf-body > div[style*="display:flex"] { flex-wrap: wrap; } .cpf-body > div[style*="display:flex"] > label { flex: 1 1 100%; width: auto !important; } .cpf-foot .btn, .cp-pop-foot .cp-btn { flex: 1 1 auto; justify-content: center; } #gcal-popup-host .cpf, .cp-pop-overlay { padding: 6px; align-items: flex-end; } }

/* ---------- in-calendar search (2026-09-28) ---------- */
.cp-toolbar-search { gap: .5rem; }
.cp-search-box { flex: 1; min-width: 200px; display: flex; align-items: center; gap: .5rem; background: #f1f3f4; border-radius: 999px; padding: .35rem .9rem; border: 1px solid transparent; }
.cp-search-box:focus-within { background: var(--cp-surface); border-color: var(--cp-line); box-shadow: 0 1px 6px rgba(60, 64, 67, .25); }
.cp-search-box i { color: var(--cp-muted); font-size: 18px; }
.cp-search-box input { flex: 1; border: none; background: transparent; font: inherit; font-size: 14px; color: var(--cp-text); padding: .3rem 0; min-width: 0; outline: none; }
.cp-search-box input::-webkit-search-cancel-button { display: none; }
.cp-search-clear { border: none; background: transparent; color: var(--cp-muted); cursor: pointer; width: 28px; height: 28px; border-radius: 50%; font-size: 16px; }
.cp-search-clear:hover { background: var(--cp-hover); }
.cp-seg-btn { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid var(--cp-line); background: var(--cp-surface); color: var(--cp-text); border-radius: 6px; padding: .45rem .8rem; font-size: 13px; cursor: pointer; }
.cp-seg-btn:hover { background: var(--cp-hover); } .cp-seg-btn.on { background: #e8f0fe; color: #1967d2; border-color: #c6dafc; }
.cp-search { padding: 0; overflow: hidden; }
.cp-search-adv { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: flex-end; padding: .7rem .9rem; border-bottom: 1px solid var(--cp-line); background: rgba(60, 64, 67, .03); }
.cp-search-adv label { display: flex; flex-direction: column; gap: 3px; font-size: 11.5px; color: var(--cp-muted); font-weight: 500; }
.cp-search-adv label.chk { flex-direction: row; align-items: center; gap: 6px; padding-bottom: 6px; }
.cp-search-adv input, .cp-search-adv select { padding: 6px 9px; border: 1px solid var(--cp-line); border-radius: 7px; background: var(--cp-surface); color: var(--cp-text); font: inherit; font-size: 13px; }
.cp-search-adv input[type="date"] { direction: ltr; }
.cp-search-hint { font-size: 11.5px; color: var(--cp-muted); }
.cp-search-head { display: flex; align-items: center; gap: .8rem; padding: .55rem .9rem; border-bottom: 1px solid var(--cp-line); font-size: 12.5px; color: var(--cp-muted); flex-wrap: wrap; }
.cp-search-head .cnt { font-weight: 600; color: var(--cp-text); }
.cp-search-results { max-height: calc(100vh - 230px); min-height: 300px; overflow: auto; }
.cp-sgroup { border-bottom: 1px solid var(--cp-line-soft); }
.cp-sdate { position: sticky; top: 0; background: var(--cp-surface); font-size: 12.5px; font-weight: 600; color: var(--cp-text); padding: .5rem .9rem .25rem; z-index: 1; }
.cp-srow { display: flex; align-items: center; gap: .7rem; padding: .45rem .9rem; cursor: pointer; border-radius: 8px; margin: 0 .3rem; }
.cp-srow:hover { background: var(--cp-hover); } .cp-srow:focus-visible { outline: 2px solid var(--cp-today); outline-offset: -2px; }
.cp-srow .tm { width: 92px; flex-shrink: 0; font-size: 12.5px; color: var(--cp-muted); }
.cp-srow .dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.cp-srow .tt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.cp-srow .t { font-size: 13.5px; color: var(--cp-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-srow .m { font-size: 11.5px; color: var(--cp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-srow .tags { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 2px; }
.cp-link { border: none; background: transparent; color: #1a73e8; font: inherit; font-size: 11.5px; cursor: pointer; padding: 0; text-decoration: underline; }
.cp-srow .cp-show { flex-shrink: 0; padding: .3rem .6rem; font-size: 12px; opacity: .85; }
.cp-search-more { display: flex; align-items: center; gap: 1rem; padding: .7rem .9rem; }
.cp-flash { animation: cpflash 5s ease; box-shadow: 0 0 0 3px #1a73e8 !important; z-index: 9 !important; }
@keyframes cpflash { 0%, 80% { box-shadow: 0 0 0 4px #1a73e8; } 100% { box-shadow: 0 1px 2px rgba(0, 0, 0, .18); } }
@media (max-width: 760px) { .cp-srow { flex-wrap: wrap; } .cp-srow .tm { width: auto; } .cp-srow .cp-show { flex-basis: 100%; justify-content: center; } .cp-search-results { max-height: none; } .cp-toolbar-search .cp-status { display: none; } }
@media (prefers-reduced-motion: reduce) { .cp-flash { animation: none; } }
