/* Church Planner — guided help 1.30.51 */
.tour-root { position:fixed; inset:0; z-index:12000; pointer-events:none; }
.tour-root:empty { display:none; }
.tour-root > * { box-sizing: border-box; }
.tour-shade { position: fixed; inset: 0; z-index: 12000; background: rgba(7, 17, 33, .52); pointer-events: none; }
.tour-spotlight { position: fixed; z-index: 12001; border: 2px solid #7dd3fc; border-radius: 10px; box-shadow: 0 0 0 9999px rgba(7,17,33,.52), 0 0 0 3px rgba(56,189,248,.25); pointer-events: none; transition: none; }
.tour-guide, .tour-offer, .tour-help-panel { font-family: inherit; color: #e7edf7; background: #162134; border: 1px solid #34445d; box-shadow: 0 24px 64px rgba(0,0,0,.32); pointer-events: auto; }
.tour-guide { position: fixed; top:50%; left:50%; transform:translate(-50%,-50%); z-index: 12002; width: min(344px, calc(100vw - 24px)); border-radius: 18px; overflow: hidden; }
.tour-guide[data-placement="floating"] { transform:none; }
.tour-guide[data-placement="center"] { top: 50%; left: 50%; transform: translate(-50%,-50%); }
.tour-guide-top, .tour-guide-actions, .tour-help-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.tour-guide-top { padding: 14px 18px 0; }
.tour-kicker { color: #9bb4d5; text-transform:uppercase; letter-spacing:.09em; font-size:10px; font-weight:800; }
.tour-close { color:inherit; font-size:25px; border: 0; border-radius: 9px; background:transparent; padding: 6px 10px; cursor:pointer; line-height:1; min-width:44px; min-height:44px; }
.tour-close:hover { background: rgba(255,255,255,.1); }
.tour-progress { height: 3px; background: #354258; margin: 7px 18px 0; border-radius: 10px; overflow:hidden; }
.tour-progress > span { display:block; background:#7dd3fc; height:100%; transition:width .2s; }
.tour-guide-content { padding: 13px 18px 12px; }
.tour-count { display:inline-block; font-size:12px; color:#acc0d8; }
.tour-guide h2 { font-size: 17px; font-weight:750; color:#fff; line-height:1.3; margin: 7px 0 9px; }
.tour-guide p { color:#dde5ef; font-size: 14px; line-height:1.55; margin: 0; }
.tour-guide p.tour-missing { color:#c4d5eb; background: rgba(125,211,252,.11); border-radius:10px; padding:10px; margin-top:10px; }
.tour-guide p.tour-error { color:#fecaca; font-size:12px; margin-top:8px; }
.tour-guide-actions { padding:10px 18px 16px; }
.tour-guide-actions button, .tour-offer button { font: inherit; font-weight:650; font-size:13px; cursor:pointer; border-radius:10px; padding:9px 13px; min-height:44px; border:1px solid #4b6280; background:transparent; color:inherit; }
.tour-guide-actions button:disabled { opacity:.4; cursor:default; }
.tour-guide-actions button.tour-next, .tour-offer button[data-tour-command="start"] { background:#b2e2ff; color:#10223b; border-color:#b2e2ff; }
.tour-guide-actions button:hover:not(:disabled), .tour-offer button:hover { filter:brightness(1.1); }
.tour-help-launcher { display:inline-flex; align-items:center; justify-content:center; gap:5px; white-space:nowrap; min-width:44px; min-height:44px; font-size:17px; font-weight:700; }
.tour-help-label { font-size:12px; font-weight:650; }
.tour-offer { z-index:11999; position:fixed; right:18px; bottom:20px; width:min(360px,calc(100vw - 32px)); padding:18px; border-radius:16px; }
.tour-offer strong { color:#fff; font-size:15px; }
.tour-offer p { font-size:13px; color:#c4d5ea; line-height:1.5; margin:7px 0 16px; }
.tour-offer .tour-actions { display:flex; flex-wrap:wrap; gap:6px; }
.tour-offer button[data-tour-command="disable-auto"] { font-size:11px; border:0; text-decoration:underline; padding-inline:4px; }
.tour-help-backdrop { position:fixed; inset:0; z-index:11997; background:rgba(5,12,24,.6); pointer-events:auto; }
.tour-help-panel { position:fixed; z-index:11998; left:50%; top:50%; transform:translate(-50%,-50%); width:min(600px,calc(100vw - 28px)); max-height:min(730px, calc(100dvh - 28px)); display:flex; flex-direction:column; border-radius:20px; padding:22px; overflow:auto; overscroll-behavior:contain; }
.tour-help-heading h2 { font-size:24px; color:#fff; margin:4px 0 5px; }
.tour-help-heading p { color:#bbcde2; font-size:13px; margin:0; }
.tour-help-groups { flex:1; overflow:auto; padding-right:3px; }
.tour-help-group h3 { color:#aebfd3; font-size:12px; text-transform:uppercase; letter-spacing:.07em; margin:21px 0 8px; }
.tour-topic { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; text-align:left; background:#1e2e46; border:1px solid #334861; color:#fff; border-radius:12px; padding:11px 13px; margin:6px 0; cursor:pointer; min-height:54px; }
.tour-topic strong { display:block; font-size:14px; font-weight:650; }
.tour-topic small { color:#a5b6ce; display:block; margin-top:2px; font-size:12px; }
.tour-topic-status { white-space:nowrap; color:#aadeff; font-size:12px; }
.tour-topic:hover { border-color:#82cffa; }
.tour-auto-toggle { display:flex; align-items:center; gap:9px; color:#e6edf7; font-size:13px; margin-top:16px; min-height:44px; }
.tour-auto-toggle input { accent-color:#7dd3fc; width:19px; height:19px; }
.tour-footer-note { color:#aec2d9; font-size:12px; line-height:1.5; margin:10px 0 0; }
.dashboard-help-shortcuts { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; margin:6px 0 12px; }
.dashboard-help-shortcuts button { min-height:44px; }
@media (max-width:820px) {
 .tour-help-label { display:none; }
 .tour-guide { left: max(8px,env(safe-area-inset-left)) !important; right:max(8px,env(safe-area-inset-right)); top:auto; width:auto; max-height:min(60dvh, 420px); overflow:auto; border-radius:17px; transform:none !important; }
 .tour-guide[data-placement="mobile-bottom"], .tour-guide[data-placement="floating"] { transform:none; }
.tour-guide[data-placement="center"] { bottom:calc(8px + env(safe-area-inset-bottom)); top:auto; }
 .tour-guide[data-placement="mobile-top"] { top:calc(8px + env(safe-area-inset-top)); bottom:auto; }
 .tour-guide-top { padding:9px 14px 0; }
 .tour-guide-content { padding:9px 14px; }
 .tour-guide h2 { font-size:15px; margin:4px 0 7px; }
 .tour-guide p { font-size:13px; line-height:1.42; }
 .tour-guide-actions { padding:6px 14px 12px; }
 .tour-offer { left:12px; right:12px; bottom:calc(14px + env(safe-area-inset-bottom)); width:auto; }
 .tour-help-panel { bottom:0; top:auto; left:0; right:0; transform:none; width:100%; padding:16px; max-height:92dvh; border-radius:20px 20px 0 0; padding-bottom:calc(14px + env(safe-area-inset-bottom)); }
 .tour-help-heading h2 { font-size:21px; }
}
@media (prefers-reduced-motion:reduce) { .tour-progress > span { transition:none; } }

/* Contextual teaching never obstructs section navigation. */
.tour-section-offer { z-index:12003; }
#dashboardParticipationPrompt[data-tour-demo="participation"] { border:1px dashed #7dd3fc; background:color-mix(in srgb, #7dd3fc 7%, var(--cp-surface, #152238)); }
#dashboardParticipationPrompt[data-tour-demo="participation"] .dashboard-confirm-copy > span { color:#7dd3fc; font-weight:800; }
#dashboardParticipationPrompt[data-tour-demo="participation"] [data-tour-demo-confirm] { cursor:pointer; }

/* 1.30.52: self-contained, non-persistent practice inside guided tours. */
.tour-guide:has(.tour-sample-slot) { width:min(400px, calc(100vw - 24px)); max-height:min(88dvh, 760px); display:flex; flex-direction:column; }
.tour-guide:has(.tour-sample-slot) .tour-guide-content { overflow-y:auto; overscroll-behavior:contain; min-height:0; }
.tour-guide:has(.tour-sample-slot) .tour-guide-actions { flex-shrink:0; }
.tour-sample-slot { margin-top:10px; }
.tour-sample-toggle { width:100%; min-height:44px; text-align:left; cursor:pointer; background:#263a55; color:#e6f1ff; border:1px solid #425b78; border-radius:10px; padding:9px 12px; font:inherit; font-weight:650; font-size:13px; }
.tour-sample { border:1px dashed #679cc1; background:#101d30; border-radius:12px; padding:12px; margin-top:8px; display:grid; gap:9px; font-size:12px; color:#e1ebf8; }
.tour-sample-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.tour-sample-head > strong { font-size:13px; }
.tour-sample-head > span { font-size:10px; color:#abc3da; background:#243650; border-radius:5px; padding:3px 6px; }
.tour-sample .tour-sample-note { color:#9fb6d1; font-size:11px; border-top:1px solid #2d4159; padding-top:8px; }
.tour-sample p { white-space:pre-line; font-size:12px; line-height:1.45; }
.tour-sample button { background:#20334d; border:1px solid #405b78; border-radius:8px; color:#eff7ff; min-height:36px; padding:7px 9px; font-size:12px; text-align:left; cursor:pointer; }
.tour-sample button:disabled {opacity:.35; cursor:default;}
.tour-sample button[aria-pressed="true"] {background:#375a7b; border-color:#76b4e0;}
.tour-sample .tour-sample-field {display:grid; gap:5px; font-size:12px; font-weight:600; color:#bdd2e5; }
.tour-sample input,.tour-sample select,.tour-sample textarea {display:block; width:100%; box-sizing:border-box; min-width:0; font:inherit; font-size:13px; color:#eaf4ff; background:#1d2d43; border:1px solid #526981; border-radius:8px; padding:9px; }
.tour-sample input {min-height:38px;}
.tour-sample .tour-sample-fields {display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.tour-sample .tour-sample-options,.tour-sample .tour-sample-tabs {display:flex; flex-wrap:wrap; gap:6px; }
.tour-sample .tour-sample-detail {background:#22334b; border-radius:9px; padding:9px; display:grid; gap:7px;}
.tour-sample .tour-sample-detail strong {color:#fff;}
.tour-sample .tour-sample-result {background:#24445a; border-radius:8px; padding:9px; color:#e7f5ff;}
.tour-sample-stages {margin:0; padding:0; list-style:none; display:grid; gap:6px;}
.tour-sample-stages li {display:flex; align-items:center; gap:6px; min-height:36px; background:#1e3048; padding:5px 6px; border-radius:7px;}
.tour-sample-stages li > span { flex:1; }
.tour-sample-stages li button {text-align:center; min-width:36px; }
@media (max-width:820px) {
 .tour-guide:has(.tour-sample-slot) {max-height: min(82dvh, 650px); width:auto;}
 .tour-sample {padding:10px;}
 .tour-sample .tour-sample-fields {grid-template-columns:1fr 1fr;}
}

.tour-sample-calendar {display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; text-align:center; margin:5px 0; }
.tour-sample-calendar span {color:#a2b9d2; font-size:9px;}
.tour-sample-calendar button {font:inherit;font-size:11px;padding:4px 0;min-width:0;min-height:34px;text-align:center;}
.tour-sample-calendar button[aria-pressed="true"] {outline:2px solid #81c6f5;}

.tour-help-footer { margin-top:10px; }
.tour-release-link { background:none; border:0; color:#b2e2ff; cursor:pointer; font:inherit; font-size:13px; text-decoration:underline; min-height:44px; padding:8px 2px; }

/* 1.30.53: mobile guide docks outside the highlighted content and bottom nav. */
@media (max-width: 820px) {
 .tour-guide, .tour-guide:has(.tour-sample-slot) {
   position: fixed; top: auto; bottom: auto; left: max(8px,env(safe-area-inset-left)) !important;
   right: max(8px,env(safe-area-inset-right)); width:auto; max-height: 300px;
   display:flex; flex-direction:column; overflow:hidden; transform:none !important;
   border-radius: 15px;
 }
 .tour-guide[data-placement="mobile-top"], .tour-guide[data-placement="mobile-bottom"] { transform:none !important; bottom:auto; }
 .tour-guide-content { min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:8px 14px; }
 .tour-guide-top { flex-shrink:0; }
 .tour-guide-actions { flex-shrink:0; padding:8px 14px 12px; }
 .tour-guide h2 { font-size:15px; margin:4px 0 6px; }
 .tour-guide p { font-size:13px; line-height:1.4; }
 .tour-sample { padding:8px; }
 .tour-offer { bottom:calc(90px + env(safe-area-inset-bottom)); max-height:65dvh; overflow:auto; }
}
