/* Connectors sheet and Google Calendar on the Calendar page (connectors.js). */

.gcal-logo{width:22px;height:22px;flex:none;display:block}
.gcal-mark{width:11px;height:11px;flex:none;display:inline-block;vertical-align:-1px;margin-right:4px}

/* "Connect your calendar" card */
.gcal-card{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px 20px;border-radius:24px;margin:0 0 16px}
.gcal-card-txt{min-width:0;flex:1 1 240px}
.gcal-card h2{font-size:17px;font-weight:700;margin:0 0 4px}
.gcal-card p{font-size:13px;color:var(--ink-2);line-height:1.45;margin:0}
.gcal-btn{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 18px 0 14px;border-radius:999px;background:#fff;color:#1f1f1f;font-weight:600;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14),0 4px 12px -6px rgba(0,0,0,.35);transition:transform .3s var(--spring)}
.gcal-btn:active{transform:scale(.97)}
.gcal-btn.is-busy{opacity:.6;cursor:progress}
.gcal-err{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--orange-ink);margin:0 6px 12px}

/* Google events: read-only, outlined, with a small mark */
.ev.ev-g{z-index:1;background:var(--bg);color:var(--ink);box-shadow:inset 0 0 0 1px var(--hair-2),0 4px 12px -8px rgba(0,0,0,.5);text-decoration:none}
.ev.ev-g b{display:-webkit-box}
.ev.ev-g b .gcal-mark{display:inline-block;vertical-align:-2px;margin:0 4px 0 0}
.ev.ev-g.is-busy,.mc-g.is-busy{color:var(--ink-2)}
span.ev.ev-g:hover{transform:none}
.ad-chip.ad-g,.mc-ev.mc-g{display:flex;align-items:center;background:var(--track);color:var(--ink);box-shadow:inset 0 0 0 1px var(--hair-2);text-decoration:none}
.gcal-row{text-decoration:none;color:inherit}
.gcal-row .gcal-mark{width:14px;height:14px;margin:0}
.legend .gcal-mark{width:12px;height:12px;margin:0}

/* "Also add to my Google Calendar" switch in Add event */
.field.gcal-also{flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.field.gcal-also span{display:flex;align-items:center}
input.switch,.field.gcal-also input.switch{appearance:none;-webkit-appearance:none;margin:0;padding:0;border:0;cursor:pointer;width:54px;min-width:54px;height:32px;border-radius:999px;flex:none;background:var(--track);box-shadow:inset 0 1px 3px rgba(0,0,0,.35),inset 0 0 0 1px var(--hair)}
.field.gcal-also span{flex:1;min-width:0}
input.switch:checked,.field.gcal-also input.switch:checked{background:linear-gradient(180deg,var(--orange-hi),var(--orange) 60%,var(--orange-deep));box-shadow:inset 0 1px 1px rgba(255,255,255,.4),0 0 16px rgba(240,86,31,.55)}
input.switch:checked::after{transform:translateX(22px)}
.field.gcal-also input.switch:focus-visible{outline:2px solid var(--orange);outline-offset:3px}

/* Connectors sheet */
.cx{display:flex;flex-direction:column;gap:10px}
.cx-row{display:flex;flex-direction:column;gap:12px;padding:14px 16px;border-radius:20px;background:var(--track);box-shadow:inset 0 0 0 1px var(--hair)}
.cx-top{display:flex;align-items:center;gap:12px;min-width:0}
.cx-top .pill{flex:none}
.cx-ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--bg);box-shadow:inset 0 0 0 1px var(--hair);flex:none}
.cx-ic .ic{width:18px;height:18px}
.cx-sub{font-size:13px;color:var(--ink-2);line-height:1.4;white-space:normal;overflow-wrap:anywhere}
.cx-acts{display:flex;gap:8px;flex-wrap:wrap}
.cx-link{display:flex;gap:8px;align-items:center;min-width:0}
.cx-url{flex:1;min-width:0;height:36px;padding:0 12px;border-radius:12px;font-size:12px;color:var(--ink-2);background:var(--bg);border:0;box-shadow:inset 0 0 0 1px var(--hair-2);text-overflow:ellipsis}
.cx-cals{display:flex;flex-direction:column;gap:6px}
.cx-cal{display:grid;grid-template-columns:minmax(0,1fr) 110px;align-items:center;gap:8px}
.cx-cal .switch{justify-self:center}
.cx-cal-t{min-width:0;overflow:hidden;text-overflow:ellipsis}
.cx-tag{height:22px;padding:0 8px;font-size:11px}.cx-tag[hidden]{display:none}
.cx-cal-h{font-size:11px;font-weight:600;color:var(--ink-2);text-align:center}
.cx-cal-n{display:flex;align-items:center;gap:8px;min-width:0;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cx-dot{width:10px;height:10px;border-radius:50%;flex:none}
@media (max-width:480px){.cx-cal{grid-template-columns:minmax(0,1fr) 96px}.gcal-btn{width:100%;justify-content:center}}
