/* 04.55.2 r15a — Settings visual completion.
 * Appearance, Profile, Workspace Holidays/SLA and Activity & Alerts only.
 * Pure styling; no changes to controls, state, sends, policies, or data models.
 */
.settings-shell {
 --r15a-blue:#557fe1;
 --r15a-teal:#299b87;
 --r15a-violet:#8c6bd4;
 --r15a-gold:#d39242;
 --r15a-red:#c35b69;
 --r15a-line:color-mix(in srgb,var(--line) 80%,var(--r15a-blue));
}
/* 1. Appearance: selectable palette controls are now intentional tiles. */
.settings-shell .sw-panel.embedded:has(.appearance-panel){
 padding:25px 26px 28px;
 background:linear-gradient(115deg,color-mix(in srgb,var(--r15a-violet) 5%,var(--surface)),var(--surface) 53%);
 border-top:4px solid var(--r15a-violet);
}
.settings-shell .appearance-panel{width:100%;max-width:none}
.settings-shell .appearance-panel>.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:800;color:var(--r15a-violet)}
.settings-shell .appearance-panel h3{font-size:23px;letter-spacing:-.5px;font-weight:800;margin:10px 0 4px}
.settings-shell .appearance-panel>p{font-size:12px;line-height:1.65;margin-bottom:3px}
.settings-shell .appearance-panel h4{
 font-size:12px;font-weight:800;letter-spacing:.025em;margin:23px 0 12px;
 display:flex;gap:9px;align-items:center
}
.settings-shell .appearance-panel h4::before{content:"";display:block;width:4px;height:18px;border-radius:8px;background:var(--r15a-teal)}
.settings-shell .mode-options{gap:13px;margin-top:19px}
.settings-shell .mode-option{
 --tile:var(--r15a-blue);
 min-height:126px;padding:19px 14px 17px;gap:11px;
 border:1px solid color-mix(in srgb,var(--tile) 21%,var(--line));
 border-radius:14px;
 background:linear-gradient(135deg,color-mix(in srgb,var(--tile) 9%,var(--surface)),var(--surface) 84%);
 box-shadow:0 4px 14px rgba(28,49,88,.04);
 position:relative;overflow:hidden;
 transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.settings-shell .mode-option:nth-child(2){--tile:var(--r15a-violet)}
.settings-shell .mode-option:nth-child(3){--tile:var(--r15a-teal)}
.settings-shell .mode-option::before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:4px;background:var(--tile);opacity:.62}
.settings-shell .mode-option>.ui-icon:first-child{
 width:34px;height:34px;padding:8px;border-radius:12px;
 box-sizing:content-box;background:color-mix(in srgb,var(--tile) 14%,var(--surface));
 color:var(--tile);
}
.settings-shell .mode-option strong{font-size:12px;font-weight:780}
.settings-shell .mode-option.active{
 border:2px solid var(--tile);padding:18px 13px 16px;
 background:linear-gradient(135deg,color-mix(in srgb,var(--tile) 14%,var(--surface)),color-mix(in srgb,var(--tile) 4%,var(--surface)) 90%);
 box-shadow:0 8px 24px color-mix(in srgb,var(--tile) 12%,transparent);
 color:var(--text)
}
.settings-shell .mode-option.active>.ui-icon:first-child{color:var(--tile)}
.settings-shell .mode-option:not(:disabled):hover{transform:translateY(-2px);border-color:var(--tile)}
.settings-shell .mode-option>.ui-icon:last-child:not(:first-child){color:var(--tile);right:11px;top:11px;width:17px;height:17px}
.settings-shell .accent-options{gap:12px}
.settings-shell .accent-option{
 min-height:88px;border-radius:13px;padding:13px 12px;gap:10px;
 background:linear-gradient(140deg,color-mix(in srgb,var(--tile,#597de0) 6%,var(--surface)),var(--surface));
 border:1px solid var(--r15a-line);font-size:11px;font-weight:700;
 transition:border-color .16s ease,transform .16s ease;
}
.settings-shell .accent-option.accent-ocean{--tile:#3779e8}
.settings-shell .accent-option.accent-forest{--tile:#21825e}
.settings-shell .accent-option.accent-violet{--tile:#7959ce}
.settings-shell .accent-option.accent-rose{--tile:#b74978}
.settings-shell .accent-option.accent-amber{--tile:#997013}
.settings-shell .accent-option.accent-slate{--tile:#576b83}
.settings-shell .accent-option .swatch{
 width:34px;height:34px;box-shadow:0 0 0 5px color-mix(in srgb,var(--tile) 11%,transparent);
}
.settings-shell .accent-option.active{
 border:2px solid var(--tile);padding:12px 11px;
 background:linear-gradient(135deg,color-mix(in srgb,var(--tile) 14%,var(--surface)),var(--surface) 88%);
}
.settings-shell .accent-option:not(:disabled):hover{border-color:var(--tile);transform:translateY(-1px)}
.settings-shell .appearance-panel .preference-note{
 margin-top:21px;padding:14px 16px;
 border:1px solid var(--r15a-line);border-radius:11px;
 background:color-mix(in srgb,var(--r15a-teal) 4%,var(--surface));
 color:var(--muted);font-size:11px;line-height:1.6
}
/* 2. Profile: prominent identity heading and distinct, readable fields. */
.settings-shell .sw-panel.profile{overflow:hidden;border-top:4px solid var(--r15a-blue);padding:23px 24px}
.settings-shell .sw-panel.profile>header{
 padding:6px 0 21px;margin-bottom:19px;gap:16px;
 background:linear-gradient(90deg,color-mix(in srgb,var(--r15a-blue) 7%,var(--surface)),var(--surface) 62%);
 border-radius:11px 11px 0 0;
}
.settings-shell .sw-panel.profile>header h2{
 display:flex;align-items:center;gap:11px;font-size:20px
}
.settings-shell .sw-panel.profile>header h2::before{
 content:"";width:5px;height:26px;border-radius:9px;flex:none;
 background:var(--r15a-blue);
}
.settings-shell .sw-profile-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.settings-shell .sw-panel.profile .sw-kv{gap:12px}
.settings-shell .sw-panel.profile .sw-kv>div{
 --field:var(--r15a-blue);
 padding:17px 18px;min-height:91px;display:flex;flex-direction:column;justify-content:center;
 border:1px solid var(--r15a-line);border-left:4px solid var(--field);
 background:linear-gradient(115deg,color-mix(in srgb,var(--field) 10%,var(--surface)),var(--surface) 82%);
 border-radius:12px;
}
.settings-shell .sw-panel.profile .sw-kv>div:nth-child(2){--field:var(--r15a-violet)}
.settings-shell .sw-panel.profile .sw-kv>div:nth-child(3){--field:var(--r15a-gold)}
.settings-shell .sw-panel.profile .sw-kv>div:nth-child(4){--field:var(--r15a-teal)}
.settings-shell .sw-panel.profile .sw-kv>div:nth-child(5){--field:var(--r15a-violet)}
.settings-shell .sw-panel.profile .sw-kv>div:nth-child(6){--field:var(--r15a-blue)}
.settings-shell .sw-panel.profile .sw-kv dt{
 font-size:10px;letter-spacing:.07em;text-transform:uppercase;font-weight:750
}
.settings-shell .sw-panel.profile .sw-kv dd{
 font-size:14px;font-weight:740;color:var(--text);line-height:1.45;margin-top:8px
}
.settings-shell .sw-panel.profile .sw-protected-note{
 margin-top:17px;padding:15px 17px;
 background:color-mix(in srgb,var(--r15a-blue) 5%,var(--surface));
 border-left:4px solid var(--r15a-blue);line-height:1.6
}
/* 3. Workspace administrative planning: holidays empty state and SLA table. */
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(3){
 border-top:4px solid var(--r15a-gold);
 background:linear-gradient(180deg,color-mix(in srgb,var(--r15a-gold) 5%,var(--surface)),var(--surface) 44%);
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4){
 border-top:4px solid var(--r15a-violet);
 background:linear-gradient(180deg,color-mix(in srgb,var(--r15a-violet) 5%,var(--surface)),var(--surface) 45%);
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(3)>.sw-empty{
 border:1px dashed color-mix(in srgb,var(--r15a-gold) 42%,var(--line));
 border-radius:13px;
 min-height:119px;display:flex;align-items:center;justify-content:center;gap:14px;
 background:color-mix(in srgb,var(--r15a-gold) 6%,var(--surface));
 font-size:13px;font-weight:650;color:var(--muted);text-align:center;
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(3)>.sw-empty::before{
 content:"";display:block;flex:none;width:31px;height:31px;
 border-radius:11px;background:color-mix(in srgb,var(--r15a-gold) 23%,var(--surface));
 box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--r15a-gold) 33%,var(--line));
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4) .sw-table{
 border:1px solid var(--r15a-line);border-radius:12px;overflow-x:auto
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4) .sw-table-head{
 border-radius:10px 10px 0 0;
 background:color-mix(in srgb,var(--r15a-violet) 11%,var(--surface));
 color:var(--text);font-size:11px;font-weight:790;
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4) .sw-table-row{
 min-height:65px;align-items:center;
 background:var(--surface);font-size:11px
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4) .sw-table-row:nth-child(odd){
 background:color-mix(in srgb,var(--r15a-violet) 3%,var(--surface))
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4) .sw-table-row strong{
 font-size:12px;color:var(--text)
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4) .sw-table-row>span:nth-child(3),
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4) .sw-table-row>span:nth-child(4){
 padding:9px 10px;border-radius:8px;font-weight:770;
 background:color-mix(in srgb,var(--r15a-blue) 9%,var(--surface));
 color:var(--text);width:fit-content
}
.settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(4) .sw-table-row>span:nth-child(4){
 background:color-mix(in srgb,var(--r15a-teal) 10%,var(--surface))
}
.settings-shell .sw-defaults{
 margin-top:17px;padding:14px 16px;border:1px solid var(--r15a-line);border-radius:11px;
 background:color-mix(in srgb,var(--r15a-violet) 4%,var(--surface))
}
.settings-shell .sw-defaults summary{font-size:12px}
.settings-shell .sw-defaults>div{gap:8px;margin-top:12px}
/* 4. Activity: clear individual incident cards rather than giant pink strips. */
.settings-shell .sw-panel.embedded:has(.activity-center){padding:18px 21px 26px;border-top:4px solid var(--r15a-blue)}
.settings-shell .activity-center{width:100%;max-width:none;min-width:0}
.settings-shell .activity-center .activity-controls{
 padding:16px 17px;margin-bottom:17px;gap:12px;flex-wrap:wrap;
 border:1px solid var(--r15a-line);border-radius:12px;
 background:linear-gradient(115deg,color-mix(in srgb,var(--r15a-blue) 8%,var(--surface)),var(--surface) 75%);
}
.settings-shell .activity-controls p{font-size:12px;line-height:1.6}
.settings-shell .activity-controls .icon-button{background:var(--surface);border:1px solid var(--r15a-line);border-radius:10px;padding:9px;min-width:35px;min-height:35px}
.settings-shell .activity-controls .text-button{border-radius:9px;padding:10px 12px}
.settings-shell .activity-sla-block{
 padding:17px 17px 18px;margin-bottom:17px;
 border:1px solid color-mix(in srgb,var(--r15a-red) 26%,var(--line));
 border-top:4px solid var(--r15a-red);border-radius:13px;
 background:color-mix(in srgb,var(--r15a-red) 3%,var(--surface));
}
.settings-shell .activity-sla-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 13px;padding:0 3px 11px;border-bottom:1px solid var(--r15a-line)}
.settings-shell .activity-sla-head strong{font-size:15px;color:var(--text);font-weight:790}
.settings-shell .activity-sla-head span{
 font-size:11px;font-weight:780;color:var(--r15a-red);
 border-radius:999px;padding:7px 12px;
 background:color-mix(in srgb,var(--r15a-red) 12%,var(--surface));
}
.settings-shell .activity-sla-block{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.settings-shell .activity-sla-head{grid-column:1/-1}
.settings-shell .activity-sla-block .notification-item.sla-event{
 min-width:0;min-height:103px;margin:0;padding:15px 15px;align-items:center;gap:13px;
 background:var(--surface);
 border:1px solid color-mix(in srgb,var(--r15a-red) 25%,var(--line));
 border-left:4px solid var(--r15a-red);border-radius:11px;
 box-shadow:0 3px 11px rgba(39,63,96,.03);
}
.settings-shell .activity-sla-block .notification-item.sla-event.warning{
 border-left-color:var(--r15a-gold);
 border-color:color-mix(in srgb,var(--r15a-gold) 26%,var(--line));
}
.settings-shell .activity-sla-block .notification-item.sla-event.critical{border-left-color:#d47731}
.settings-shell .activity-sla-block .notification-item.sla-event .notification-symbol{
 width:39px;height:39px;border-radius:12px;
 color:var(--r15a-red);background:color-mix(in srgb,var(--r15a-red) 11%,var(--surface));
}
.settings-shell .activity-sla-block .notification-item.sla-event.warning .notification-symbol{color:var(--r15a-gold);background:color-mix(in srgb,var(--r15a-gold) 11%,var(--surface))}
.settings-shell .activity-sla-block .notification-item.sla-event .notification-title{
 font-size:12px;font-weight:800;color:var(--text)
}
.settings-shell .activity-sla-block .notification-item.sla-event .notification-preview{
 font-size:11px;font-weight:670;color:var(--r15a-red)
}
.settings-shell .activity-center .notification-dot{width:8px;height:8px}
.settings-shell .notification-items{gap:9px;grid-template-columns:repeat(2,minmax(0,1fr))}
.settings-shell .notification-items>.notification-item{
 min-width:0;min-height:88px;padding:15px;align-items:center;gap:13px;
 border:1px solid var(--r15a-line);border-left:3px solid var(--r15a-blue);
 border-radius:11px;background:var(--surface);
 box-shadow:0 3px 11px rgba(39,63,96,.027)
}
.settings-shell .notification-items>.notification-item.unseen{
 background:color-mix(in srgb,var(--r15a-blue) 6%,var(--surface));
 border-left-color:var(--r15a-violet)
}
.settings-shell .notification-items>.notification-item .notification-symbol{
 width:39px;height:39px;border-radius:12px;
 background:color-mix(in srgb,var(--r15a-blue) 10%,var(--surface))
}
.settings-shell .notification-item .notification-title{
 font-size:12px;font-weight:770;line-height:1.45;white-space:normal
}
.settings-shell .notification-item .notification-preview{font-size:11px;line-height:1.5}
.settings-shell .notification-item small{font-size:10px}
.settings-shell .notification-item:not(:disabled):hover{
 border-color:color-mix(in srgb,var(--r15a-blue) 50%,var(--line));
 box-shadow:0 7px 18px rgba(37,68,115,.07)
}
.settings-shell .activity-center .notification-options{
 border:1px solid var(--r15a-line);background:color-mix(in srgb,var(--r15a-blue) 3%,var(--surface));
 border-radius:11px;padding:15px;margin-top:18px;
}
/* Responsive safeguards. Existing Settings navigation/actions remain unchanged. */
@media(max-width:1150px){
 .settings-shell .activity-sla-block,.settings-shell .notification-items{grid-template-columns:1fr}
}
@media(max-width:780px){
 .settings-shell .sw-panel.embedded:has(.appearance-panel),
 .settings-shell .sw-panel.embedded:has(.activity-center),
 .settings-shell .sw-panel.profile{padding:16px}
 .settings-shell .appearance-panel .mode-options{gap:8px}
 .settings-shell .mode-option{min-height:112px;padding:14px 8px;gap:8px}
 .settings-shell .mode-option.active{padding:13px 7px}
 .settings-shell .appearance-panel .accent-options{grid-template-columns:repeat(2,minmax(0,1fr))}
 .settings-shell .sw-panel.profile .sw-kv{grid-template-columns:1fr}
 .settings-shell .sw-panel.profile>header{padding:10px 0 16px}
}
@media(max-width:490px){
 .settings-shell .appearance-panel .mode-options{grid-template-columns:repeat(3,minmax(0,1fr))}
 .settings-shell .mode-option>.ui-icon:first-child{width:24px;height:24px;padding:7px}
 .settings-shell .mode-option strong{font-size:10px}
 .settings-shell .appearance-panel .accent-options{gap:8px}
 .settings-shell .activity-sla-block{padding:11px}
 .settings-shell .activity-sla-head{flex-wrap:wrap}
 .settings-shell .activity-center .activity-controls{padding:11px}
 .settings-shell .sw-body:has(>.sw-hero)>section.sw-panel:nth-of-type(3)>.sw-empty{padding:20px 10px;flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
 .settings-shell .mode-option,.settings-shell .accent-option{transition:none}
}
