/* Fabronex Hub — Étape 5 : Bureau connecté */
.office-entry{display:grid;gap:12px;margin-bottom:14px}
.office-connection-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.office-connection-card{background:linear-gradient(180deg,#fff,#f7fbff);border:1px solid #d8e5ef;border-radius:16px;padding:14px;display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;box-shadow:0 8px 24px rgba(18,49,75,.06)}
.office-connection-card>span{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-weight:900;background:#0d2e49;color:#fff}
.office-connection-card>span.google{background:#fff;color:#12324d;border:1px solid #d8e5ef}
.office-connection-card>span.microsoft{background:#12324d;color:#fff}
.office-connection-card strong{display:block;font-size:13px;color:#173652}
.office-connection-card small{display:block;margin-top:3px;color:#7d93a5;font-size:10px}
.office-connection-card>em{font-style:normal;font-size:9px;color:#9d7b36;text-align:right;max-width:180px}
.office-connection-card.connected>em{color:#2d7d5c}
.office-connection-card button{grid-column:2/4;width:max-content}
.office-entry-main{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px}
.office-entry-main>div:first-child{display:flex;align-items:center;gap:12px}
.office-entry-icon{width:44px;height:44px;border-radius:14px;background:#0b2b45;color:#e5bc65;display:grid;place-items:center;font-weight:900}
.office-entry-main strong{display:block;color:#173652;font-size:13px}
.office-entry-main small{display:block;color:#7e94a6;font-size:10px;margin-top:3px}
.office-entry-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.external-office-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}
.external-office-tools>button{border:1px solid #d8e5ef;background:#fff;border-radius:16px;padding:13px;display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;text-align:left}
.external-office-tools>button>span{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#0c2e49;color:#e6bd67;font-weight:900}
.external-office-tools strong{display:block;color:#183651;font-size:11px}
.external-office-tools small{display:block;color:#7d94a6;font-size:8.5px;margin-top:3px}
.external-office-tools em{font-style:normal;color:#a47d30;font-size:8px}
.office-modal{position:fixed;inset:0;z-index:1200;display:none}
.office-modal.open{display:block}
.office-modal-backdrop{position:absolute;inset:0;background:rgba(4,19,31,.62);backdrop-filter:blur(8px)}
.office-modal-dialog{position:absolute;inset:4vh 4vw;background:#f5f9fc;border:1px solid rgba(255,255,255,.3);border-radius:24px;box-shadow:0 30px 80px rgba(4,21,35,.35);overflow:hidden;display:flex;flex-direction:column}
.office-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 20px;background:linear-gradient(135deg,#08253c,#0f3958);color:#fff}
.office-modal-head h2{margin:2px 0 4px;font-size:22px}
.office-modal-head p{margin:0;color:#bfd0dc;font-size:10px}
.office-modal-head .eyebrow{color:#e0b75e}
.office-modal-head>button{border:0;background:rgba(255,255,255,.1);color:#fff;width:38px;height:38px;border-radius:12px;font-size:24px}
.office-mail-toolbar{padding:12px 16px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #d7e4ed;background:#fff}
.office-provider-switch{display:flex;gap:6px}
.office-provider-switch button{border:1px solid #d6e2eb;background:#f8fbfd;color:#4b667b;border-radius:10px;padding:9px 12px;font-weight:800;font-size:10px}
.office-provider-switch button.active{background:#0c2e49;color:#fff;border-color:#0c2e49}
#officeMailSearch{flex:1;display:flex;align-items:center;gap:8px;background:#f5f9fc;border:1px solid #d7e4ed;border-radius:12px;padding:0 10px}
#officeMailSearch input{flex:1;border:0;background:transparent;outline:0;min-height:40px;font:inherit;color:#173650}
#officeMailSearch button{border:0;background:transparent;color:#a47d30;font-weight:800}
.office-mail-layout{display:grid;grid-template-columns:minmax(280px,34%) 1fr;min-height:0;flex:1}
.office-mail-list{overflow:auto;border-right:1px solid #d8e4ec;background:#fff}
.office-mail-row{width:100%;border:0;border-bottom:1px solid #edf2f6;background:#fff;display:grid;grid-template-columns:8px 1fr auto;gap:10px;padding:13px;text-align:left}
.office-mail-row:hover{background:#f7fafc}
.office-mail-row>i{width:7px;height:7px;border-radius:50%;background:#d6e1e8;margin-top:5px}
.office-mail-row.unread>i{background:#d8a94b}
.office-mail-row strong{display:block;font-size:10px;color:#173650}
.office-mail-row span{display:block;font-size:10px;font-weight:800;color:#284a63;margin-top:2px}
.office-mail-row small{display:block;color:#7d94a6;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
.office-mail-row time{font-size:8px;color:#8195a4}
.office-mail-reader{overflow:auto;padding:20px;background:#f8fbfd}
.office-mail-reader>header{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid #d9e5ed;padding-bottom:14px}
.office-mail-reader>header small{color:#7b91a3;font-size:9px}
.office-mail-reader h3{margin:4px 0;color:#173650;font-size:18px}
.office-mail-reader>header p{margin:0;color:#748b9d;font-size:9px}
.office-mail-reader>header time{font-size:9px;color:#8094a3}
.office-mail-body{padding:18px 0;color:#334f64;font-size:11px;line-height:1.65}
.office-attachments{display:grid;gap:8px;border-top:1px solid #d9e5ed;padding-top:14px}
.office-attachments>strong{color:#173650;font-size:10px}
.office-attachments article{display:grid;grid-template-columns:42px 1fr auto auto;gap:8px;align-items:center;background:#fff;border:1px solid #dbe6ee;border-radius:12px;padding:10px}
.office-attachments article>span{width:38px;height:38px;border-radius:10px;background:#0c2e49;color:#e4bc66;display:grid;place-items:center;font-size:8px;font-weight:900}
.office-attachments article strong{display:block;font-size:10px;color:#173650}
.office-attachments article small{display:block;font-size:8px;color:#8397a6}
.office-empty,.office-loading{min-height:180px;display:grid;place-items:center;align-content:center;text-align:center;gap:6px;color:#7c91a3;padding:22px}
.office-empty>span{font-size:28px;color:#d0a653}
.office-empty strong{color:#27485f;font-size:12px}
.office-empty small{font-size:9px;max-width:340px}
.office-loading{font-size:10px}
.office-drive-toolbar{display:flex;align-items:center;gap:10px;padding:12px 16px;background:#fff;border-bottom:1px solid #d8e4ec}
.office-drive-path{flex:1;display:flex;align-items:center;gap:5px;min-width:0;overflow:auto}
.office-drive-path button{border:0;background:transparent;color:#35566e;font-weight:800;font-size:9px;white-space:nowrap}
.office-drive-path b{color:#a7b6c1}
.office-drive-actions{display:flex;gap:7px;align-items:center}
.office-upload-label{cursor:pointer}
.office-drive-list{overflow:auto;flex:1;padding:12px 16px;display:grid;align-content:start;gap:7px}
.office-drive-item{display:grid;grid-template-columns:42px minmax(160px,1fr) auto;gap:10px;align-items:center;background:#fff;border:1px solid #dae6ee;border-radius:13px;padding:10px}
.office-file-icon{width:38px;height:38px;border-radius:11px;background:#f1f6fa;display:grid;place-items:center}
.office-drive-item strong{display:block;color:#173650;font-size:10px}
.office-drive-item small{display:block;color:#8094a4;font-size:8px;margin-top:3px}
.office-drive-item-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.office-drive-item-actions .danger{color:#a94a4a}
.office-compose-dialog,.office-classify-dialog{inset:8vh max(18vw,180px)}
.office-compose-form{padding:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px;overflow:auto}
.office-compose-form label{display:grid;gap:5px}
.office-compose-form label.full,.office-picked-folder.full{grid-column:1/3}
.office-compose-form label>span,.office-picked-folder>span{font-size:8px;color:#748b9d;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.office-compose-form input,.office-compose-form select,.office-compose-form textarea{border:1px solid #d5e2eb;background:#fff;border-radius:11px;padding:10px 11px;font:inherit;color:#173650;outline:0}
.office-picked-folder{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #d7e4ed;border-radius:12px;padding:11px}
.office-picked-folder strong{flex:1;color:#173650;font-size:10px}
.office-modal-actions{display:flex;justify-content:flex-end;gap:8px;padding:13px 18px;background:#fff;border-top:1px solid #d7e4ed}
.office-search-dialog{inset:7vh 9vw}
.office-global-search{display:flex;gap:8px;padding:14px 16px;background:#fff;border-bottom:1px solid #d8e4ec}
.office-global-search>span{align-self:center;color:#a77f32}
.office-global-search input{flex:1;border:1px solid #d6e2eb;border-radius:11px;padding:10px 12px;font:inherit}
.office-search-results{overflow:auto;padding:16px;display:grid;gap:16px}
.office-search-results section{display:grid;gap:7px}
.office-search-results h3{margin:0;color:#173650;font-size:11px}
.office-search-result{border:1px solid #dae6ee;background:#fff;border-radius:12px;padding:10px;display:grid;grid-template-columns:38px 1fr;gap:10px;text-align:left}
.office-search-result>span{width:36px;height:36px;border-radius:10px;background:#eff5f9;display:grid;place-items:center}
.office-search-result strong{display:block;color:#173650;font-size:10px}
.office-search-result small{display:block;color:#7e94a5;font-size:8px;margin-top:3px}
@media(max-width:900px){
  .office-connection-row,.external-office-tools{grid-template-columns:1fr}
  .office-entry-main{align-items:flex-start;flex-direction:column}
  .office-entry-actions{justify-content:flex-start}
  .office-modal-dialog{inset:2vh 2vw;border-radius:18px}
  .office-mail-layout{grid-template-columns:1fr}
  .office-mail-list{max-height:38vh;border-right:0;border-bottom:1px solid #d8e4ec}
  .office-compose-dialog,.office-classify-dialog,.office-search-dialog{inset:3vh 3vw}
}
@media(max-width:620px){
  .office-connection-card{grid-template-columns:40px 1fr}
  .office-connection-card>em,.office-connection-card button{grid-column:2}
  .office-mail-toolbar,.office-drive-toolbar{align-items:stretch;flex-direction:column}
  #officeMailSearch{width:100%}
  .office-drive-actions{overflow:auto}
  .office-drive-item{grid-template-columns:38px 1fr}
  .office-drive-item-actions{grid-column:1/3;justify-content:flex-start}
  .office-compose-form{grid-template-columns:1fr}
  .office-compose-form label.full,.office-picked-folder.full{grid-column:1}
  .office-attachments article{grid-template-columns:38px 1fr}
  .office-attachments article button{grid-column:auto}
}