.mail-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:22px;align-items:start}.mail-clients{background:#fff;border:1px solid #d6e4e9;border-radius:12px;padding:16px;position:sticky;top:16px}.mail-clients>label{display:block;font-weight:650;margin-bottom:12px}.mail-clients input{width:100%;margin-bottom:12px}.mail-clients #mail-client-list{max-height:56vh;overflow:auto;scrollbar-width:thin;scrollbar-color:#9aafbd transparent}.mail-client{display:block;width:100%;text-align:left;border:0;background:transparent;line-height:1.5;font-weight:500;margin:3px 0;overflow-wrap:anywhere}.mail-client.active{background:#e8f3f5;color:#126e75;box-shadow:inset 3px 0 #126e75;font-weight:650}.mail-work{min-width:0}.mail-toolbar{display:flex;align-items:end;flex-wrap:wrap;gap:12px;margin-bottom:18px}.mail-toolbar label{display:grid;gap:7px;flex:1 1 160px;font-size:.8rem}.mail-toolbar input,.mail-toolbar select{width:100%;min-width:0}.mail-row{background:white;border:1px solid #dae5ed;border-radius:12px;margin-bottom:12px;padding:20px 22px}.mail-row.unread{border-left:3px solid #217b83}.mail-row-top{display:flex;justify-content:space-between;gap:14px;font-size:.78rem;color:#5f7283;overflow-wrap:anywhere}.mail-row-top>span{min-width:0}.mail-row-top time{white-space:nowrap}.mail-subject{padding:10px 0 3px;border:0;background:transparent;display:flex;text-align:left;color:#243f52;font-size:1rem;line-height:1.5;overflow-wrap:anywhere}.mail-subject:hover{background:transparent;color:#126e75}.mail-row p{font-size:.85rem;line-height:1.7;color:#5f7283;margin:6px 0 14px;overflow-wrap:anywhere}.mail-row-meta{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:.75rem;color:#526c7f}.mail-suggestion{color:#946423;background:#fff4df;padding:4px 8px;border-radius:5px}.mail-unread-dot{width:7px;height:7px;border-radius:50%;background:#21808a;flex-shrink:0}.mail-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:20px 0}.mail-metrics>div{padding:18px;border:1px solid #d5e4e9;border-radius:10px;background:linear-gradient(135deg,#fff,#edf6f7)}.mail-metrics strong{display:block;font-size:1.8rem;color:#1b6970}.mail-metrics span{display:block;color:#5b7383;font-size:.8rem;margin-top:5px}.mail-sync-state{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.8rem;color:#5f7283;margin-bottom:20px}.mail-sync-state.error{color:#a94040}.mail-pagination{display:flex;gap:12px;justify-content:flex-end;align-items:center;font-size:.8rem;margin:20px 0}.mail-message-heading p{font-size:.8rem;line-height:1.8;color:#5f7283;overflow-wrap:anywhere}.mail-message-heading h3{font-size:1.1rem;line-height:1.5;overflow-wrap:anywhere}.mail-body{border:1px solid #dbe5ec;border-radius:8px;margin:18px 0;padding:15px;background:#f8fafc}.mail-body summary,.mail-history summary{cursor:pointer;font-size:.85rem;font-weight:650}.mail-body pre{white-space:pre-wrap;overflow-wrap:anywhere;font:14px/1.8 "Segoe UI",sans-serif;max-height:320px;overflow:auto;scrollbar-width:thin}.mail-attachments{display:grid;gap:8px;margin-bottom:18px}.mail-attachments>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px;border:1px solid #dbe5ec;border-radius:8px;font-size:.8rem}.mail-attachments span{overflow-wrap:anywhere;min-width:0}.mail-history{margin-top:22px;border-top:1px solid #dbe5ec;padding-top:16px}.mail-history p{font-size:.8rem;line-height:1.7;overflow-wrap:anywhere}.mail-message-form label{font-size:.85rem;font-weight:600}.mail-message-form textarea{font-weight:400}.mail-badge{background:#207c84;color:#fff}.mail-badge[hidden]{display:none}@media(max-width:1000px){.mail-layout{grid-template-columns:190px minmax(0,1fr)}.mail-row-top{flex-direction:column;gap:5px}}@media(max-width:760px){.mail-layout{grid-template-columns:1fr}.mail-clients{position:static}.mail-clients #mail-client-list{max-height:180px}.mail-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.mail-row{padding:16px}.mail-sync-state{align-items:flex-start;flex-direction:column}}

.mail-origin{display:block;margin-top:5px;font-size:.73rem;color:#477a84}.mail-dreamhost{padding:14px 18px;border:1px solid #c9dfe5;border-radius:10px;background:#eaf4f6}.mail-dreamhost strong{line-height:1.8}.mail-dreamhost p{margin:8px 0 0}

.mail-folders-layout{grid-template-columns:280px minmax(0,1fr);margin-top:22px}.mail-folders-layout .mail-clients{padding:18px 12px}.mail-folders-layout .mail-clients>label,.mail-folder-help{padding:0 7px}.mail-folder-group{font-size:.66rem;letter-spacing:.09em;font-weight:700;color:#788d9c;margin:23px 8px 9px}.mail-folder-group:first-child{margin-top:8px}.mail-folder{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:9px;padding:12px 9px;margin:5px 0;color:#395769}.mail-folder:hover{background:#f1f7f9}.mail-folder.active{background:#e8f4f5;border-color:#c2dfe2;box-shadow:inset 3px 0 #177b82}.mail-folder-icon{display:flex;flex:0 0 20px;color:#7b98a8}.mail-folder-icon svg,.mail-folder-count svg,.mail-folder-help svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.mail-folder-text{min-width:0;flex:1}.mail-folder-text strong{display:block;font-size:.86rem;line-height:1.4;font-weight:600;overflow-wrap:anywhere}.mail-folder.has-unread strong{font-weight:750;color:#164b60}.mail-folder-text small{display:block;font-size:.7rem;font-weight:400;line-height:1.5;color:#718595;margin-top:3px;overflow-wrap:anywhere}.mail-folder-count{display:flex;gap:4px;align-items:center;justify-content:center;flex-shrink:0;background:#fff0db;color:#8c590c;border:1px solid #f0d8ae;border-radius:20px;min-width:35px;padding:4px 6px;font-size:.71rem;font-weight:750}.mail-folder-count svg{width:13px;height:13px}.mail-folder-help{display:flex;align-items:flex-start;gap:8px;color:#7b8e9b;font-size:.7rem;line-height:1.6;margin:18px 0 3px}.mail-folder-help svg{width:15px;min-width:15px}.mail-folder-empty{color:#899aa5;font-size:.76rem;padding:7px}.mail-box-heading{padding:23px 25px;border:1px solid #cfe1e8;border-radius:12px;background:linear-gradient(120deg,#ecf6f7,#fff)}.mail-box-heading h2{margin:8px 0;font-size:1.3rem;line-height:1.35;overflow-wrap:anywhere}.mail-box-heading p{margin:6px 0 10px;color:#607e8e;font-size:.83rem;overflow-wrap:anywhere}.mail-box-type{font-size:.65rem;letter-spacing:.1em;font-weight:750;color:#187981}.mail-box-connection{font-size:.71rem;color:#637c8a}.mail-folders-layout .mail-metrics{gap:10px;margin:14px 0}.mail-folders-layout .mail-metrics>div{padding:14px}.mail-folders-layout .mail-metrics strong{font-size:1.4rem}.mail-folders-layout .mail-metrics span{font-size:.73rem}.mail-connection{font-size:.78rem;margin-bottom:20px;border-bottom:1px solid #dae5eb;padding:0 0 15px;color:#617e8e}.mail-connection>summary{cursor:pointer;padding:6px 2px}.mail-connection .mail-sync-state{margin-top:14px;margin-bottom:0}.mail-connection .primary{margin-top:14px}.mail-folder:focus-visible{outline:2px solid #157c86;outline-offset:2px}@media(max-width:1100px){.mail-folders-layout{grid-template-columns:240px minmax(0,1fr)}.mail-folders-layout .mail-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:800px){.mail-folders-layout{grid-template-columns:1fr}.mail-folders-layout .mail-clients{position:static}.mail-folders-layout #mail-client-list{max-height:255px}.mail-box-heading{padding:18px}}

/* Microsoft mailbox setup */
.mail-provider-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.mail-provider-options section{border:1px solid var(--line,#d6e1eb);border-radius:14px;background:#f5f8fc;padding:20px}.mail-provider-options p{overflow-wrap:anywhere}.mail-setup-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 22px}.mail-setup-steps>div{border:1px solid #ccdcec;background:#f0f6fc;border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px}.mail-setup-steps span{font-size:.85rem;color:#506984}.mail-setup-instructions{padding-left:24px;line-height:1.7}.mail-setup-instructions li{margin-bottom:14px}.mail-setup-instructions input{width:100%;margin:8px 0}.mail-outlook-status{padding:8px 0}.mail-outlook-status .actions{flex-wrap:wrap}@media(max-width:650px){.mail-provider-options,.mail-setup-steps{grid-template-columns:1fr}}
