/* Smart DNS control standard; colors come from the shared TOLF stylesheet. */
#quickSetupCard { --tolf-disabled-bg:var(--tolf-blue);--tolf-disabled-text:#fff;color:var(--tolf-ink);background:var(--tolf-card);border:1px solid var(--tolf-line);border-radius:18px;font-size:16px;line-height:normal; }
#quickSetupCard [hidden] { display:none!important; }
#quickSetupCard > .card-content { padding:22px; }
#quickSetupCard > .card-content > h2 { margin:0 0 12px;text-align:center;font-size:22px;font-weight:700;letter-spacing:-.3px;color:inherit; }
#quickSetupCard > .card-content > .card-description { margin:0 0 18px;color:var(--tolf-muted);line-height:1.4; }
#quickSetupCard #myVpnPlatforms { margin:0 0 18px; }
#quickSetupCard .vpn-setup-tabs { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0;margin:0 0 22px;background:transparent;border:0;border-radius:0; }
/* Keep the original three-part platform switcher from styles.css. */
/* Setup modes use the Smart DNS outlined and selected action states. */
#quickSetupCard .vpn-setup-tab {
 box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;min-width:0;
 height:48px;min-height:48px;max-height:none;padding:0 14px;margin:0;
 border:1px solid var(--tolf-outline);border-radius:var(--tolf-radius);
 background:var(--tolf-card);color:var(--tolf-action-text);
 font-family:inherit;font-size:16px;font-weight:500;line-height:1.2;text-align:center;white-space:normal;cursor:pointer;box-shadow:none;opacity:1;
}
/* Quick setup is recommended before a mode is chosen; panels still open on click. */
#quickSetupCard .vpn-setup-tab[aria-selected="true"],
body:not([data-vpn-setup-mode="manual"]) #quickSetupCard #quickSetupLink { border-color:var(--tolf-blue);background:var(--tolf-blue);color:#fff;font-weight:600;box-shadow:none; }
#quickSetupCard .vpn-setup-tab:hover:not(:disabled):not([aria-selected="true"]) { background:var(--tolf-secondary-hover); }
#quickSetupCard .vpn-setup-tab:disabled { opacity:1;cursor:default; }
#quickSetupCard .vpn-setup-mode-panel { margin:0; }
#quickSetupCard .vpn-protocol-field { margin:0 0 14px; }
#quickSetupCard .vpn-compact-label { color:var(--tolf-muted);font-size:13px;font-weight:400;margin-bottom:7px; }
/* Standalone fields match Smart DNS #deviceName. */
#quickSetupCard .vpn-dropdown-button,
#quickSetupCard :is(.settings-input,.settings-select),
#shadowrocketSetup .sr-field input {
 box-sizing:border-box;min-height:44px;height:auto;padding:9px 12px;
 border:1px solid #c9c9ce;border-radius:11px;background:#fff;color:#171717;
 font-family:inherit;font-size:16px;font-weight:400;line-height:normal;
}
#quickSetupCard .vpn-dropdown-button { height:44px; }
#quickSetupCard textarea.settings-input { min-height:70px; }
#quickSetupCard :is(.settings-input,.settings-select),#shadowrocketSetup .sr-field input { outline:none; }
#quickSetupCard :is(.settings-input,.settings-select):focus,#shadowrocketSetup .sr-field input:focus { border-color:#7c7c82; }
#quickSetupCard .vpn-dropdown-value-meta { color:#6e6e73; }
#quickSetupCard .vpn-dropdown.open .vpn-dropdown-button { border-radius:11px 11px 0 0; }
#quickSetupCard .vpn-dropdown-menu { background:var(--tolf-card); }
#quickSetupCard .vpn-protocol-explanation { margin:0 0 14px; }
#quickSetupCard #quickSetupHelp { color:var(--tolf-muted);font-size:16px;line-height:1.4; }
/* Smart DNS action geometry; state colors retain the shared primary/secondary hierarchy. */
#quickSetupCard :is(button.primary,button.secondary,a.button-link) {
 box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;height:48px;min-height:48px;padding:0 16px;
 border-radius:var(--tolf-radius);font-family:inherit;font-size:16px;font-weight:600;line-height:1.2;
 text-align:center;text-decoration:none;white-space:normal;box-shadow:none;
}
#quickSetupCard :is(button.primary,a.primary) { border:1px solid var(--tolf-blue);background:var(--tolf-blue);color:#fff; }
#quickSetupCard :is(button.secondary,a.secondary) { border:1px solid var(--tolf-outline);background:var(--tolf-card);color:var(--tolf-action-text);line-height:1.3; }
#quickSetupCard :is(button.primary,a.primary):hover:not(:disabled):not([aria-disabled="true"]) { background:var(--tolf-blue-hover);border-color:var(--tolf-blue-hover); }
#quickSetupCard :is(button.secondary,a.secondary):hover:not(:disabled):not([aria-disabled="true"]) { background:var(--tolf-secondary-hover);border-color:var(--tolf-outline); }
#quickSetupCard :is(button.primary,a.primary):is(:disabled,[aria-disabled="true"]) { opacity:1;background:var(--tolf-disabled-bg);border-color:var(--tolf-disabled-bg);color:var(--tolf-disabled-text); }
/* Availability changes behavior, not the approved action palette. */
#quickSetupCard :is(button,a.button-link):is(:disabled,[aria-disabled="true"]) { opacity:1;cursor:default; }
#quickSetupCard #srAccountForm button.primary { width:220px;min-width:220px;max-width:220px; }
#quickSetupCard #quickStartLink { display:flex;width:100%;min-width:0;max-width:none;margin-top:18px; }
#quickSetupCard #vpnCard { margin:0;padding:0;width:100%; }
#quickSetupCard #vpnCard > .card { padding:0;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none; }
#quickSetupCard #vpnCard > .card > .card-content { padding:0; }
#quickSetupCard #vpnCard .card-topline { margin:0;gap:0;min-height:0; }
#quickSetupCard #vpnCard .card-topline > h2 { display:none; }
#quickSetupCard #vpnCard.manual-protocol-pending #iosManualShared > :not(#manualProtocolField) { display:none!important; }
#quickSetupCard #manualProtocolField { margin-bottom:18px; }
#quickSetupCard #iosManualChoiceHelp { margin:0 0 12px;color:var(--tolf-muted);font-size:13px;font-weight:400;line-height:1.4; }
#quickSetupCard #iosManualClients { gap:12px;margin-top:0; }
/* Disclosure cards use the same outlined and selected states as device choices. */
#quickSetupCard .ios-manual-client { border:0;background:transparent; }
#quickSetupCard .ios-manual-client-head { min-height:68px;height:auto;padding:10px 14px;gap:10px;border:1px solid var(--tolf-outline);border-radius:var(--tolf-radius);background:var(--tolf-card);color:var(--tolf-action-text);font-size:16px;font-weight:500;line-height:1.2; }
#quickSetupCard .ios-manual-client-head[aria-expanded="true"] { border-color:var(--tolf-blue);border-radius:var(--tolf-radius) var(--tolf-radius) 0 0;background:var(--tolf-blue);color:#fff;font-weight:600; }
#quickSetupCard .ios-manual-client-copy strong { font-size:16px;font-weight:inherit; }
#quickSetupCard .ios-manual-client-copy small { color:var(--tolf-muted);font-size:13px;font-weight:400;line-height:1.4; }
#quickSetupCard .ios-manual-client-head[aria-expanded="true"] small { color:inherit; }
#quickSetupCard .ios-manual-client-symbol { display:inline-flex;align-items:center;justify-content:center;flex:0 0 30px;width:30px;height:30px;background:transparent;color:inherit; }
#quickSetupCard .ios-manual-client-symbol svg { width:21px;height:21px; }
#quickSetupCard .ios-manual-chevron { color:inherit; }
#quickSetupCard .ios-manual-client-body { padding:18px;border:1px solid var(--tolf-blue);border-top:0;border-radius:0 0 var(--tolf-radius) var(--tolf-radius);background:var(--tolf-card); }
#quickSetupCard #shadowrocketSetup .sr-actions { gap:10px;align-items:center;margin-top:18px; }
#quickSetupCard #srPrepare { width:100%;min-width:0;max-width:none;height:auto;padding:10px 16px; }
#quickSetupCard #shadowrocketSetup .sr-file-actions { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch; }
#quickSetupCard :is(#srShareConfig,#srDownloadConfig,#srBack) { width:100%;min-width:0;max-width:none;height:auto;padding:10px 8px; }
#quickSetupCard #srBack { width:calc((100% - 10px)/2); }
#quickSetupCard #shadowrocketSetup .sr-field > span:first-child { color:var(--tolf-muted);font-size:13px;font-weight:400; }
#quickSetupCard #shadowrocketSetup h3 { font-size:18px;font-weight:600; }
#quickSetupCard #shadowrocketSetup .sr-note { color:var(--tolf-muted); }
#quickSetupCard input:is([type="checkbox"],[type="radio"]) { accent-color:var(--tolf-blue); }
#quickSetupCard .vpn-page-tools { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:22px;padding-top:18px;border-top:1px solid var(--tolf-line); }
#quickSetupCard .vpn-page-tools > .connection-page-action { min-width:0;margin:0; }
#quickSetupCard .vpn-page-tools .button-link { display:flex;width:100%;margin:0; }
#quickSetupCard #ciscoClientInstall .vpn-client-install-row > .button-link { margin:12px 0; }
#quickSetupCard .vpn-client-install-row a.button-link { width:100%;min-width:0;max-width:none; }
@media(min-width:700px) {
 #quickSetupCard .vpn-client-install-row { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:10px;margin:12px 0; }
 #quickSetupCard #ciscoClientInstall .vpn-client-install-row > :is(.button-link,.cisco-install-link,.cisco-install-confirm),
 #quickSetupCard #shadowrocketSetup .vpn-client-install-row > :is(.sr-actions,.sr-check) { min-width:0;margin:0; }
 #quickSetupCard .vpn-client-install-row > :is(.cisco-install-confirm,.sr-check) { min-height:48px; }
 #quickSetupCard .vpn-client-install-row > .cisco-install-confirm input { flex:0 0 20px; }
}
@media(max-width:560px) {
 #quickSetupCard { border-radius:16px; }
 #quickSetupCard > .card-content { padding:18px; }
 #quickSetupCard #srAccountForm button.primary { width:100%;min-width:0;max-width:none; }
 #quickSetupCard .ios-manual-client-body { padding:14px; }
 #quickSetupCard .vpn-page-tools { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:360px) {
 #myVpnPlatforms .platform-button { gap:4px;padding:0 2px;font-size:13px; }
 #myVpnPlatforms .platform-icon { width:14px;height:14px;flex-basis:14px; }
}