/* Personal profile view styled after macOS Sonoma System Settings. */
#settings-window.system-window {
  width: 816px !important; height: 550px !important;
  min-width: 816px !important; min-height: 550px !important;
  max-width: 816px !important; max-height: 550px !important;
  resize: none !important; overflow: hidden;
}
#settings-window > .titlebar {
  position:absolute; inset:0 0 auto; z-index:3; height:52px; min-height:52px; padding:0 16px;
  background:transparent; border-bottom:0;
}
#settings-window .traffic-lights { gap: 1px; }
#settings-window .traffic-lights :is(.minimize, .maximize):disabled {
  background-color: transparent !important;
  background-image: url('../assets/traffic-lights/disabled.svg') !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 12px 12px !important;
  border: 0 !important; opacity: 1; cursor: default;
}
#settings-window .resize-handle { display: none !important; }
#settings-window .window-content {
  height:100%; min-height:0; display:grid;
  grid-template-columns:260px minmax(0,1fr); padding:0 !important;
  overflow:hidden !important; background:transparent;
}
.personal-settings-sidebar {
  min-height:0; overflow:hidden; padding:58px 14px 18px;
  display:flex; flex-direction:column;
  background:rgba(78,77,82,.88); border-right:1px solid rgba(0,0,0,.42);
  -webkit-backdrop-filter:blur(42px) saturate(165%); backdrop-filter:blur(42px) saturate(165%);
}
.settings-account-mini { display:flex; align-items:center; gap:10px; margin:0 3px 13px; }
.settings-photo {
  width:48px; height:48px; flex:0 0 auto; border-radius:50%; object-fit:cover;
  object-position:50% 31%; box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 1px 4px rgba(0,0,0,.32);
}
.settings-account-mini .settings-photo { width:42px; height:42px; }
.settings-account-mini strong { display:block; font-size:13px; line-height:16px; font-weight:600; }
.settings-account-mini span { display:block; font-size:11px; line-height:14px; color:rgba(255,255,255,.52); }
.settings-app-groups {
  min-height:0; flex:1; display:flex; flex-direction:column; justify-content:space-between; gap:9px;
}
.settings-app-group { display:grid; gap:2px; }
.settings-app-row {
  height:26px; display:flex; align-items:center; gap:9px; padding:0 5px; border-radius:6px;
  color:rgba(255,255,255,.90); font-size:12px; font-weight:450; white-space:nowrap;
}
.settings-app-row:hover { background:rgba(255,255,255,.08); }
.settings-app-icon {
  --tile-a:#2585dd; --tile-b:#1760ad; width:18px; height:18px; flex:0 0 18px;
  display:grid; place-items:center; border-radius:5px;
  background:linear-gradient(145deg,var(--tile-a),var(--tile-b));
  box-shadow:inset 0 1px rgba(255,255,255,.22),0 1px 2px rgba(0,0,0,.28);
}
.settings-app-icon img { width:12px; height:12px; object-fit:contain; }
.settings-app-icon img { display:block; object-position:center; transform:translateZ(0); }
.tile-green { --tile-a:#32c875; --tile-b:#15964d; }
.tile-cyan { --tile-a:#27bcdc; --tile-b:#177ca9; }
.tile-lime { --tile-a:#64c86e; --tile-b:#258c43; }
.tile-orange { --tile-a:#ff8a31; --tile-b:#dc4d1f; }
.tile-red { --tile-a:#ff5c64; --tile-b:#ce2439; }
.tile-magenta { --tile-a:#f65082; --tile-b:#b91f54; }
.tile-blue { --tile-a:#3a9df1; --tile-b:#1766ba; }
.tile-indigo { --tile-a:#667af1; --tile-b:#3540a7; }
.personal-settings-main {
  min-width:0; padding:58px 30px 18px; overflow:hidden; background:rgba(29,29,31,.88);
  -webkit-backdrop-filter:blur(42px) saturate(145%); backdrop-filter:blur(42px) saturate(145%);
  display:flex; flex-direction:column;
}
.settings-profile { display:grid; justify-items:center; margin:3px 0 15px; }
.settings-profile .settings-photo { width:72px; height:72px; }
.settings-profile h2 { margin:8px 0 1px; font-size:15px; line-height:18px; font-weight:600; }
.settings-profile p { margin:0; font-size:10px; color:rgba(255,255,255,.60); }
.settings-about-card,.settings-language-card {
  overflow:hidden; border:1px solid rgba(255,255,255,.13); border-radius:8px;
  background:rgba(255,255,255,.025);
}
.settings-about-card {
  min-height:0; padding:12px 14px; overflow:auto;
  color:rgba(255,255,255,.76); font-size:10.5px; line-height:1.42;
}
.settings-about-card p { margin:0 0 8px; }
.settings-about-card p:first-child { color:rgba(255,255,255,.92); font-weight:550; }
.settings-about-card p:last-child { margin-bottom:0; }
.settings-info-row,.settings-language-row {
  min-height:28px; display:grid; grid-template-columns:142px minmax(0,1fr); align-items:center;
  gap:12px; padding:0 12px; border-bottom:1px solid rgba(255,255,255,.085); font-size:10.5px;
}
.settings-info-row:last-child,.settings-language-row:last-child { border-bottom:0; }
.settings-info-label { color:rgba(255,255,255,.83); font-weight:500; }
.settings-info-value { color:rgba(255,255,255,.56); text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.settings-language-card { margin-top:0; }
.settings-language-row { grid-template-columns:82px minmax(0,1fr); min-height:32px; }
.settings-language-name { font-size:10.5px; color:rgba(255,255,255,.84); }
.settings-language-meter {
  --level:50%; position:relative; height:5px; border-radius:999px;
  background:rgba(255,255,255,.17);
  box-shadow:inset 0 1px 1px rgba(0,0,0,.38),0 1px rgba(255,255,255,.035);
  cursor:default; touch-action:auto; pointer-events:none; user-select:none;
}
.settings-language-meter::before {
  content:""; position:absolute; left:var(--level); top:50%; width:7px; height:20px;
  border-radius:4px; background:linear-gradient(180deg,#b0b0b2,#89898c);
  border:1px solid rgba(255,255,255,.13);
  box-shadow:0 1px 3px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.22);
  transform:translate(-50%,-50%); z-index:2;
}
.settings-language-meter::after {
  content:none;
}
