/* Palladium.Drive — /account/drive file browser */

/* Accent INK — accent used as text/outline on light surfaces. The raw brand
   emerald (#1AD598) is 1.83:1 on white and fails WCAG; --accent-fg is the
   account theme's dark accent (theme-aware via --accent-h). Brand emerald
   stays for backgrounds, tints and decorative icons. */
.pd-drive-toolbar, .pd-drive-spaces, .pd-drive-searchbar, .pd-drive-items,
.pd-drive-share-panel, .pd-drive-quota, .pd-drive-uploading, .pd-drive-ctx {
    --pd-ink: var(--accent-fg, #0B7A57);
}

.pd-drive-toolbar { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; margin-bottom: .45rem; font-size: .85rem; }
.pd-drive-toolbar .spacer { flex: 1; }

.pd-drive-breadcrumb { display: flex; align-items: center; gap: .1rem; font-size: .86rem; flex-wrap: wrap; }
.pd-drive-breadcrumb button { display: inline-flex; align-items: center; gap: .3rem; background: none; border: 1px solid transparent; padding: .18rem .45rem; border-radius: .35rem; cursor: pointer; color: var(--pd-ink, #0B7A57); font: inherit; font-size: .86rem; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-drive-breadcrumb button:hover { background: var(--surface-2, rgba(148,163,184,.12)); }
.pd-drive-breadcrumb button.is-dropover { background: color-mix(in srgb, var(--pd-emerald, #1AD598) 20%, transparent); border-color: var(--pd-ink, #0B7A57); border-style: dashed; }
.pd-drive-breadcrumb button svg { flex: none; color: var(--pd-emerald, #1AD598); }
.pd-drive-breadcrumb .sep { color: var(--fg-subtle, #94A3B8); font-size: .95rem; padding: 0 .05rem; user-select: none; }
.pd-drive-breadcrumb .current { color: var(--fg, #1e293b); font-weight: 600; padding: .18rem .45rem; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.pd-drive-list { display: flex; flex-direction: column; border: 1px solid var(--border, rgba(148,163,184,.25)); border-radius: .6rem; overflow: hidden; }
.pd-drive-row { display: flex; align-items: center; gap: .6rem; padding: .42rem .75rem; border-bottom: 1px solid var(--border, rgba(148,163,184,.18)); font-size: .86rem; }
.pd-drive-row:last-child { border-bottom: none; }
.pd-drive-row:hover { background: var(--surface-2, rgba(148,163,184,.07)); }
.pd-drive-row .icon { width: 20px; height: 20px; flex: none; color: var(--fg-muted, #64748B); }
.pd-drive-row .icon.folder { color: var(--pd-emerald, #1AD598); }
.pd-drive-row .name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-drive-row .name button { background: none; border: none; padding: 0; cursor: pointer; font: inherit; color: inherit; }
.pd-drive-row .name button:hover { text-decoration: underline; }
.pd-drive-row .meta { font-size: .78rem; color: var(--fg-muted, #64748B); white-space: nowrap; }
.pd-drive-row .actions { display: flex; gap: .25rem; }
.pd-drive-row .actions a,
.pd-drive-row .actions button { background: none; border: none; padding: .25rem; cursor: pointer; color: var(--fg-muted, #64748B); border-radius: .3rem; display: inline-flex; }
.pd-drive-row .actions a:hover,
.pd-drive-row .actions button:hover { color: var(--pd-emerald, #1AD598); background: var(--surface-2, rgba(148,163,184,.12)); }
.pd-drive-row .actions button.danger:hover { color: #e5484d; }
.pd-drive-row .actions svg { width: 16px; height: 16px; }

.pd-drive-empty { padding: 2.2rem 1rem; text-align: center; color: var(--fg-muted, #64748B); font-size: .9rem; }

/* ── Search bar + filters + sort ── */
.pd-drive-searchbar { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; margin-bottom: .45rem; }
.pd-drive-searchinput { position: relative; display: flex; align-items: center; flex: 1; min-width: 200px; max-width: 380px; }
.pd-drive-search-go { position: absolute; left: .15rem; background: none; border: none; min-width: 26px; min-height: 26px; align-items: center; justify-content: center; cursor: pointer; color: var(--fg-muted, #64748B); display: inline-flex; }
.pd-drive-search-go:hover { color: var(--pd-ink, #0B7A57); }
.pd-drive-searchinput input { width: 100%; padding: .3rem .3rem .3rem 1.8rem; border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .4rem; background: var(--surface, transparent); color: inherit; font-size: .82rem; }
.pd-drive-searchinput input:focus { outline: none; border-color: var(--pd-emerald, #1AD598); }
.pd-drive-search-clear { position: absolute; right: .4rem; background: none; border: none; cursor: pointer; color: var(--fg-muted, #64748B); font-size: 1.05rem; line-height: 1; padding: .05rem .25rem; border-radius: .3rem; }
.pd-drive-search-clear:hover { color: #e5484d; }
.pd-drive-select { padding: .28rem .4rem; border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .4rem; background: var(--surface, transparent); color: inherit; font-size: .78rem; }

/* ── Compact list ── */
.pd-drive-list.compact .pd-drive-row { padding: .22rem .7rem; }
.pd-drive-list.compact .pd-drive-row .icon { width: 15px; height: 15px; }
.pd-drive-list.compact .pd-drive-row .name { font-size: .84rem; }
.pd-drive-list.compact .pd-drive-row .meta { font-size: .72rem; }
.pd-drive-list.compact .pd-drive-row .actions a,
.pd-drive-list.compact .pd-drive-row .actions button { padding: .12rem; }
.pd-drive-list.compact .pd-drive-row .actions svg { width: 14px; height: 14px; }

/* ── Selection / drag & drop ── */
.pd-drive-row, .pd-drive-card { cursor: default; user-select: none; }
.pd-drive-row.is-selected, .pd-drive-card.is-selected { background: color-mix(in srgb, var(--pd-emerald, #1AD598) 12%, transparent); outline: 1px solid var(--pd-ink, #0B7A57); outline-offset: -1px; }
.pd-drive-row.is-droptarget, .pd-drive-card.is-droptarget { background: color-mix(in srgb, var(--pd-emerald, #1AD598) 22%, transparent); outline: 2px dashed var(--pd-emerald, #1AD598); outline-offset: -2px; }
.pd-drive-row.is-lasso, .pd-drive-card.is-lasso { background: color-mix(in srgb, var(--pd-emerald, #1AD598) 12%, transparent); outline: 1px solid var(--pd-emerald, #1AD598); outline-offset: -1px; }
/* Cut to clipboard — dimmed until pasted, like Windows Explorer. */
.pd-drive-row.is-cut, .pd-drive-card.is-cut { opacity: .45; }

/* Clipboard chip (appears in the toolbar while something is cut/copied) */
.pd-drive-clipchip { display: inline-flex; align-items: stretch; border: 1px dashed var(--pd-ink, #0B7A57); border-radius: .45rem; overflow: hidden; }
.pd-drive-clipchip .paste { background: color-mix(in srgb, var(--pd-emerald, #1AD598) 10%, transparent); border: none; padding: .3rem .6rem; font-size: .8rem; color: var(--pd-ink, #0B7A57); font-weight: 600; cursor: pointer; }
.pd-drive-clipchip .paste:hover { background: color-mix(in srgb, var(--pd-emerald, #1AD598) 22%, transparent); }
.pd-drive-clipchip .clear { background: none; border: none; border-left: 1px dashed var(--pd-ink, #0B7A57); padding: 0 .45rem; cursor: pointer; color: var(--fg-muted, #64748B); font-size: .95rem; line-height: 1; }
.pd-drive-clipchip .clear:hover { color: #e5484d; }
.pd-drive-lasso { position: fixed; z-index: 1084; border: 1px solid var(--pd-emerald, #1AD598); background: color-mix(in srgb, var(--pd-emerald, #1AD598) 14%, transparent); pointer-events: none; }
.pd-drive-items.pd-drop-active { outline: 2px dashed var(--pd-emerald, #1AD598); outline-offset: -2px; border-radius: .6rem; }

/* ── Checkboxes (visible on hover or while a selection exists) ── */
.pd-drive-check { flex: none; display: inline-flex; align-items: center; margin: 0; opacity: 0; transition: opacity .1s ease; }
.pd-drive-check input { width: 14px; height: 14px; accent-color: var(--pd-ink, #0B7A57); cursor: pointer; }
.pd-drive-row:hover .pd-drive-check,
.pd-drive-row.is-selected .pd-drive-check,
.pd-drive-check:focus-within,
.pd-drive-items:has(.is-selected) .pd-drive-check { opacity: 1; }
.pd-drive-selectall { display: inline-flex; align-items: center; margin: 0 .1rem 0 .15rem; }
.pd-drive-selectall input { width: 14px; height: 14px; accent-color: var(--pd-ink, #0B7A57); cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .pd-drive-check { transition: none; } }

/* ── Star (favoris), lock mark, unseen badges ── */
.pd-drive-star.is-fav { color: #e5a13b !important; }
.pd-drive-lockmark { flex: none; margin-left: .35rem; color: var(--fg-muted, #64748B); vertical-align: -1px; }
.pd-drive-publicmark { flex: none; margin-left: .35rem; color: var(--pd-ink, #0B7A57); vertical-align: -1px; }
.pd-drive-newdot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--pd-emerald, #1AD598); margin-left: .35rem; vertical-align: 2px; }
.pd-badge.new { background: color-mix(in srgb, var(--pd-emerald, #1AD598) 18%, transparent); color: var(--pd-ink, #0B7A57); margin-left: .3rem; }

/* ── Folder picker modal (déplacer/copier vers) ── */
.pd-drive-picker { width: min(480px, 94vw); height: min(60vh, 520px); }
.pd-drive-picker-tree { flex: 1; overflow: auto; padding: .5rem .6rem; display: flex; flex-direction: column; gap: .05rem; }
.pd-drive-picker-row { display: flex; align-items: center; gap: .1rem; }
.pd-drive-picker-node { display: inline-flex; align-items: center; gap: .4rem; background: none; border: 1px solid transparent; border-radius: .35rem; padding: .24rem .5rem; cursor: pointer; color: inherit; font-size: .85rem; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-drive-picker-node svg { flex: none; color: var(--pd-emerald, #1AD598); }
.pd-drive-picker-node:hover { background: var(--surface-2, rgba(148,163,184,.12)); }
.pd-drive-picker-node.is-picked { background: color-mix(in srgb, var(--pd-emerald, #1AD598) 14%, transparent); border-color: var(--pd-ink, #0B7A57); font-weight: 600; }
.pd-drive-picker-node:disabled { opacity: .4; cursor: not-allowed; }

/* ── Tree view ── */
.pd-drive-chevron { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; background: none; border: none; border-radius: .3rem; cursor: pointer; color: var(--fg-muted, #64748B); padding: 0; }
.pd-drive-chevron:hover { background: var(--surface-2, rgba(148,163,184,.15)); color: var(--fg, #1e293b); }
.pd-drive-chevron svg { transition: transform .12s ease; }
.pd-drive-chevron.is-open svg { transform: rotate(90deg); }
.pd-drive-chevron-spacer { flex: none; width: 20px; }
@media (prefers-reduced-motion: reduce) { .pd-drive-chevron svg { transition: none; } }

/* ── View toggle ── */
.pd-drive-viewtoggle { display: inline-flex; border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .45rem; overflow: hidden; }
.pd-drive-viewtoggle button { background: transparent; border: none; padding: .28rem .45rem; min-height: 26px; min-width: 28px; align-items: center; justify-content: center; cursor: pointer; color: var(--fg-muted, #64748B); display: inline-flex; }
.pd-drive-viewtoggle button.is-active { color: var(--pd-ink, #0B7A57); background: var(--surface-2, rgba(148,163,184,.12)); }
.pd-drive-viewtoggle svg { width: 15px; height: 15px; }

/* ── Grid view ── */
.pd-drive-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: .45rem; border: none; }
.pd-drive-grid .pd-drive-empty { grid-column: 1 / -1; border: 1px solid var(--border, rgba(148,163,184,.25)); border-radius: .6rem; }
.pd-drive-card { display: flex; flex-direction: column; border: 1px solid var(--border, rgba(148,163,184,.25)); border-radius: .5rem; overflow: hidden; }
.pd-drive-card:hover { border-color: var(--border-strong, rgba(148,163,184,.5)); }
.pd-drive-thumb { height: 78px; display: flex; align-items: center; justify-content: center; background: var(--surface-2, rgba(148,163,184,.08)); overflow: hidden; }
.pd-drive-thumb img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.pd-drive-thumb .icon.folder { width: 34px; height: 34px; color: var(--pd-emerald, #1AD598); }
.pd-drive-ext { font-size: .68rem; font-weight: 700; letter-spacing: .05em; color: var(--fg-muted, #64748B); border: 1px solid var(--border, rgba(148,163,184,.35)); border-radius: .3rem; padding: .2rem .45rem; }
.pd-drive-ext.pdf { color: #e5484d; border-color: #e5484d; }
.pd-drive-card .name { padding: .3rem .5rem 0; font-size: .76rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-drive-card .meta { padding: 0 .5rem; font-size: .66rem; color: var(--fg-muted, #64748B); }
.pd-drive-card .actions { display: flex; gap: .1rem; padding: .2rem .35rem .3rem; }
.pd-drive-card .actions a, .pd-drive-card .actions button { background: none; border: none; padding: .2rem; cursor: pointer; color: var(--fg-muted, #64748B); border-radius: .3rem; display: inline-flex; }
.pd-drive-card .actions a:hover, .pd-drive-card .actions button:hover { color: var(--pd-emerald, #1AD598); background: var(--surface-2, rgba(148,163,184,.12)); }
.pd-drive-card .actions button.danger:hover { color: #e5484d; }
.pd-drive-card .actions svg { width: 15px; height: 15px; }

/* ── User picker (add member) ── */
.pd-drive-userpicker { position: relative; }
.pd-drive-userpicker-results { position: absolute; left: 0; right: 0; top: 100%; z-index: 1075; background: var(--surface, #fff); border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .45rem; box-shadow: 0 8px 24px rgba(0,0,0,.18); max-height: 220px; overflow: auto; display: flex; flex-direction: column; }
.pd-drive-userpicker-results button { display: block; width: 100%; text-align: left; background: none; border: none; padding: .45rem .7rem; font-size: .86rem; color: inherit; cursor: pointer; }
.pd-drive-userpicker-results button:hover { background: var(--surface-2, rgba(148,163,184,.12)); }
.pd-drive-userpicker-results .meta { font-size: .76rem; color: var(--fg-muted, #64748B); margin-left: .4rem; }

/* ── Context menu ── */
.pd-drive-ctx-backdrop { position: fixed; inset: 0; z-index: 1085; }
.pd-drive-ctx { position: fixed; z-index: 1086; min-width: 200px; padding: .3rem; background: var(--surface, #fff); border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .5rem; box-shadow: 0 10px 32px rgba(0,0,0,.25); display: flex; flex-direction: column; }
.pd-drive-ctx button, .pd-drive-ctx a { display: block; width: 100%; text-align: left; background: none; border: none; padding: .42rem .7rem; border-radius: .35rem; font-size: .86rem; color: inherit; cursor: pointer; text-decoration: none; }
.pd-drive-ctx button:hover, .pd-drive-ctx a:hover { background: var(--surface-2, rgba(148,163,184,.12)); }
.pd-drive-ctx button.danger { color: #e5484d; }
.pd-drive-ctx button.danger:hover { background: rgba(229,72,77,.1); }
.pd-drive-ctx .sep { height: 1px; margin: .25rem .4rem; background: var(--border, rgba(148,163,184,.25)); }
.pd-drive-ctx .muted { padding: .42rem .7rem; font-size: .82rem; color: var(--fg-muted, #64748B); }

/* ── Preview modal ── */
.pd-drive-modal { position: fixed; inset: 0; z-index: 1090; background: rgba(4, 12, 22, .72); display: flex; align-items: center; justify-content: center; padding: 2rem; }
.pd-drive-modal-body { background: var(--surface, #fff); color: inherit; border-radius: .7rem; width: min(960px, 96vw); height: min(84vh, 900px); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 18px 60px rgba(0,0,0,.4); }
.pd-drive-modal-head { display: flex; align-items: center; gap: .6rem; padding: .6rem .9rem; border-bottom: 1px solid var(--border, rgba(148,163,184,.25)); }
.pd-drive-modal-head strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .92rem; }
.pd-drive-modal-head .spacer { flex: 1; }
.pd-drive-modal-content { flex: 1; overflow: auto; display: flex; align-items: center; justify-content: center; background: var(--surface-2, rgba(148,163,184,.06)); }
.pd-drive-modal-content img { max-width: 100%; max-height: 100%; object-fit: contain; }
.pd-drive-modal-content iframe { width: 100%; height: 100%; border: none; }
.pd-drive-nopreview { display: flex; flex-direction: column; align-items: center; gap: .55rem; padding: 2rem; text-align: center; }

/* ── Office preview (docx/xlsx rendered client-side) ── */
.pd-drive-office { width: 100%; height: 100%; overflow: auto; background: #fff; display: flex; flex-direction: column; align-self: stretch; }
.pd-drive-office-loading { padding: 2rem; text-align: center; color: var(--fg-muted, #64748B); font-size: .88rem; }
.pd-drive-office-error { padding: 2rem 2rem .6rem; text-align: center; color: var(--fg-muted, #64748B); font-size: .88rem; }
.pd-drive-office > a.pd-drive-btn { align-self: center; margin-bottom: 1.5rem; }
.pd-drive-office .docx-wrapper { background: var(--surface-2, #f1f5f9); padding: 1rem; flex: 1; }
.pd-drive-office .docx-wrapper > section.docx { box-shadow: 0 2px 10px rgba(0,0,0,.12); margin: 0 auto .8rem; }
.pd-drive-sheet-tabs { display: flex; gap: .2rem; padding: .4rem .6rem 0; border-bottom: 1px solid var(--border, rgba(148,163,184,.25)); background: var(--surface-2, #f8fafc); flex: none; }
.pd-drive-sheet-tabs button { border: 1px solid var(--border, rgba(148,163,184,.3)); border-bottom: none; border-radius: .35rem .35rem 0 0; background: transparent; padding: .22rem .6rem; font-size: .76rem; cursor: pointer; color: var(--fg-muted, #64748B); }
.pd-drive-sheet-tabs button.is-active { background: #fff; color: var(--fg, #1e293b); font-weight: 600; }
.pd-drive-sheet-host { flex: 1; overflow: auto; padding: .4rem; }
.pd-drive-sheet-host table { border-collapse: collapse; font-size: .78rem; }
.pd-drive-sheet-host td { border: 1px solid var(--border, rgba(148,163,184,.3)); padding: .18rem .45rem; white-space: nowrap; max-width: 340px; overflow: hidden; text-overflow: ellipsis; }
.pd-drive-nopreview .pd-drive-ext { font-size: .9rem; padding: .4rem .7rem; }
.pd-drive-nopreview .muted { color: var(--fg-muted, #64748B); font-size: .82rem; }

.pd-drive-btn.danger { border-color: #e5484d; color: #e5484d; }
.pd-drive-btn.danger:hover { background: #e5484d; color: #fff; }

.pd-drive-quota { margin-top: .55rem; font-size: .72rem; color: var(--fg-muted, #64748B); }
.pd-drive-quota-bar { height: 6px; border-radius: 3px; background: var(--surface-2, rgba(148,163,184,.18)); overflow: hidden; margin-top: .3rem; }
.pd-drive-quota-bar > div { height: 100%; background: var(--pd-emerald, #1AD598); border-radius: 3px; }
.pd-drive-quota-bar > div.warn { background: #e5a13b; }
.pd-drive-quota-bar > div.full { background: #e5484d; }

.pd-drive-inline-form { display: flex; gap: .3rem; align-items: center; }
.pd-drive-inline-form input { padding: .26rem .45rem; border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .35rem; background: var(--surface, transparent); color: inherit; font-size: .8rem; }
.pd-drive-share-panel select { font-size: .78rem; padding: .26rem .4rem; }

.pd-drive-error { margin: .6rem 0; padding: .55rem .8rem; border-radius: .45rem; background: rgba(229,72,77,.12); color: #e5484d; font-size: .85rem; }

.pd-drive-uploading { display: flex; align-items: center; gap: .5rem; margin: .6rem 0; padding: .55rem .8rem; border-radius: .45rem; background: color-mix(in srgb, var(--pd-emerald, #1AD598) 12%, transparent); color: var(--pd-ink, #0B7A57); font-size: .85rem; }
.pd-drive-spin { width: 14px; height: 14px; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: pd-drive-spin .8s linear infinite; }
@keyframes pd-drive-spin { to { transform: rotate(360deg); } }

.pd-drive-btn { display: inline-flex; align-items: center; gap: .3rem; padding: .3rem .6rem; border-radius: .4rem; border: 1px solid var(--border, rgba(148,163,184,.3)); background: transparent; color: inherit; font-size: .8rem; cursor: pointer; }
.pd-drive-btn.icon-only { padding: .3rem .4rem; }
.pd-drive-btn svg { width: 14px; height: 14px; }
.pd-drive-btn:hover { border-color: var(--pd-emerald, #1AD598); color: var(--pd-emerald, #1AD598); }
.pd-drive-btn.primary { background: var(--pd-emerald, #1AD598); border-color: var(--pd-emerald, #1AD598); color: #0B1929; font-weight: 600; }
.pd-drive-btn.primary:hover { background: var(--pd-emerald-hover, #15B880); color: #0B1929; }
.pd-drive-btn.is-active { border-color: var(--pd-ink, #0B7A57); color: var(--pd-ink, #0B7A57); }
.pd-drive-btn svg { width: 15px; height: 15px; }

/* ── Space switcher ── */
.pd-drive-spaces { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; margin-bottom: .45rem; font-size: .78rem; color: var(--fg-muted, #64748B); }
.pd-drive-space-pill { display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .55rem; border-radius: 999px; border: 1px solid var(--border, rgba(148,163,184,.3)); background: transparent; color: inherit; font-size: .78rem; cursor: pointer; }
.pd-drive-space-pill:hover { border-color: var(--pd-emerald, #1AD598); }
.pd-drive-space-pill.is-active { border-color: var(--pd-ink, #0B7A57); color: var(--pd-ink, #0B7A57); font-weight: 600; }
.pd-drive-space-pill.is-dropover { border-style: dashed; border-color: var(--pd-ink, #0B7A57); background: color-mix(in srgb, var(--pd-emerald, #1AD598) 18%, transparent); }
.pd-drive-space-pill .pd-badge,
.pd-drive-org-head .pd-badge { padding: .1rem .4rem; border-radius: .3rem; background: var(--surface-2, rgba(148,163,184,.18)); color: var(--fg-muted, #64748B); font-size: .68rem; font-weight: 600; }

/* ── Organizations page ── */
.pd-drive-org-subhead { font-weight: 600; font-size: .82rem; margin: .55rem 0 .25rem; color: var(--fg, #1e293b); }
.pd-drive-chip { display: inline-flex; align-items: center; gap: .25rem; margin-left: .35rem; padding: .08rem .45rem; border-radius: 999px; background: var(--surface-2, rgba(148,163,184,.16)); font-size: .72rem; color: var(--fg-muted, #64748B); }
.pd-drive-chip button { background: none; border: none; padding: 0; cursor: pointer; color: inherit; font-size: .82rem; line-height: 1; }
.pd-drive-chip button:hover { color: #e5484d; }
.pd-drive-org { border: 1px solid var(--border, rgba(148,163,184,.25)); border-radius: .6rem; margin-bottom: .8rem; overflow: hidden; }
.pd-drive-org-head { display: flex; align-items: center; gap: .6rem; padding: .7rem .9rem; }
.pd-drive-org-head .spacer { flex: 1; }
.pd-drive-org-body { border-top: 1px solid var(--border, rgba(148,163,184,.18)); padding: .7rem .9rem; }
.pd-drive-org-body select { padding: .3rem .5rem; border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .35rem; background: var(--surface, transparent); color: inherit; font-size: .88rem; }

/* ── Share panel ── */
.pd-drive-share-panel { display: flex; gap: .9rem; flex-wrap: wrap; padding: .55rem .75rem; border-bottom: 1px solid var(--border, rgba(148,163,184,.18)); background: var(--surface-2, rgba(148,163,184,.05)); }
.pd-drive-share-panel .pd-drive-share-col { flex: 1; min-width: 260px; display: flex; flex-direction: column; gap: .35rem; }
.pd-drive-share-panel strong { font-size: .78rem; }
.pd-drive-share-panel .pd-drive-row { border: none; padding: .2rem 0; }
.pd-drive-share-panel .pd-badge { padding: .1rem .4rem; border-radius: .3rem; background: var(--surface-2, rgba(148,163,184,.18)); color: var(--fg-muted, #64748B); font-size: .68rem; font-weight: 600; margin-left: .35rem; }
.pd-drive-share-panel select { padding: .3rem .5rem; border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .35rem; background: var(--surface, transparent); color: inherit; font-size: .88rem; }
.pd-drive-newlink input { font-size: .78rem; color: var(--pd-emerald, #1AD598); }

/* ── Info tooltips (pure CSS, hover + keyboard focus — same pattern as Bookings .bk-info) ── */
.pd-info { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; margin-left: .3rem; border-radius: 50%; background: var(--surface-2, rgba(148,163,184,.25)); color: var(--fg-muted, #64748B); font-size: .68rem; font-weight: 700; font-style: normal; cursor: help; position: relative; vertical-align: middle; user-select: none; }
.pd-info:hover, .pd-info:focus { background: var(--pd-emerald, #1AD598); color: #0B1929; outline: none; }
.pd-info::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%) scale(.96); width: max-content; max-width: 280px; padding: .5rem .65rem; border-radius: .4rem; background: #212529; color: #fff; font-size: .74rem; font-weight: 400; line-height: 1.45; white-space: normal; text-align: left; opacity: 0; visibility: hidden; transition: opacity .12s ease, transform .12s ease; pointer-events: none; z-index: 1080; box-shadow: 0 4px 12px rgba(0,0,0,.25); }
.pd-info::before { content: ''; position: absolute; bottom: calc(100% + 3px); left: 50%; transform: translateX(-50%); border: 5px solid transparent; border-top-color: #212529; opacity: 0; visibility: hidden; transition: opacity .12s ease; pointer-events: none; z-index: 1080; }
.pd-info:hover::after, .pd-info:focus::after,
.pd-info:hover::before, .pd-info:focus::before { opacity: 1; visibility: visible; transform: translateX(-50%) scale(1); }

/* ── Accessibility: visible keyboard focus (quality floor) ── */
.pd-drive-row:focus-visible,
.pd-drive-card:focus-visible,
.pd-drive-btn:focus-visible,
.pd-drive-space-pill:focus-visible,
.pd-drive-viewtoggle button:focus-visible,
.pd-drive-search-go:focus-visible,
.pd-drive-search-clear:focus-visible,
.pd-drive-select:focus-visible,
.pd-drive-ctx button:focus-visible,
.pd-drive-ctx a:focus-visible,
.pd-drive-row .actions a:focus-visible,
.pd-drive-row .actions button:focus-visible,
.pd-drive-card .actions a:focus-visible,
.pd-drive-card .actions button:focus-visible {
    outline: 2px solid var(--pd-ink, #0B7A57);
    outline-offset: 1px;
}
.pd-drive-row:focus-visible, .pd-drive-card:focus-visible { outline-offset: -2px; }

/* ── Accessibility: reduced motion ── */
@media (prefers-reduced-motion: reduce) {
    .pd-drive-spin { animation: none; }
    .pd-info::after, .pd-info::before,
    .pd-drive-row, .pd-drive-card, .pd-drive-btn, .pd-drive-space-pill { transition: none !important; }
}

/* ── Responsive: small screens ── */
@media (max-width: 560px) {
    .pd-drive-row .meta { display: none; }
    .pd-drive-toolbar, .pd-drive-searchbar, .pd-drive-spaces { gap: .3rem; }
    .pd-drive-searchinput { min-width: 140px; }
    .pd-drive-grid { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); }
    .pd-drive-modal { padding: .5rem; }
    .pd-drive-modal-body { height: 92vh; }
    .pd-drive-share-panel .pd-drive-share-col { min-width: 100%; }
    .pd-info::after { max-width: 220px; }
}

/* ── Public-page Document widget (static SSR, no circuit) ── */
.pd-doc-btn { display: inline-flex; align-items: center; gap: .5rem; padding: .55rem 1.1rem; border-radius: .5rem; background: var(--pd-emerald, #1AD598); color: #0B1929; font-weight: 600; text-decoration: none; font-size: .92rem; }
.pd-doc-btn:hover { background: var(--pd-emerald-hover, #15B880); color: #0B1929; }
.pd-doc-btn:focus-visible { outline: 2px solid #0B1929; outline-offset: 2px; }
.pd-doc-list { display: flex; flex-direction: column; border: 1px solid rgba(148,163,184,.3); border-radius: .6rem; overflow: hidden; }
.pd-doc-row { display: flex; align-items: center; gap: .6rem; padding: .55rem .85rem; text-decoration: none; color: inherit; border-bottom: 1px solid rgba(148,163,184,.18); font-size: .9rem; }
.pd-doc-row:last-child { border-bottom: none; }
.pd-doc-row:hover { background: rgba(148,163,184,.08); }
.pd-doc-row:focus-visible { outline: 2px solid var(--pd-emerald, #1AD598); outline-offset: -2px; }
.pd-doc-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-doc-size { font-size: .78rem; opacity: .65; white-space: nowrap; }
.pd-doc-empty { padding: 1.2rem; text-align: center; opacity: .65; font-size: .88rem; }
.pd-doc-inline { max-width: 100%; border-radius: .5rem; }
.pd-doc-frame { width: 100%; height: 70vh; border: 1px solid rgba(148,163,184,.3); }

/* ── Document card + icon buttons (widget) ── */
.pd-doc-card { display: flex; align-items: center; gap: .8rem; padding: .7rem .9rem; border: 1px solid rgba(148,163,184,.3); border-radius: .6rem; max-width: 560px; flex-wrap: wrap; }
.pd-doc-card-ext { flex: none; font-size: .7rem; font-weight: 700; letter-spacing: .05em; color: #e5484d; border: 1px solid currentColor; border-radius: .35rem; padding: .3rem .5rem; }
.pd-doc-card-body { flex: 1; min-width: 140px; display: flex; flex-direction: column; gap: .1rem; }
.pd-doc-card-name { font-weight: 600; font-size: .92rem; overflow-wrap: anywhere; }
.pd-doc-btn.ghost { background: transparent; color: inherit; border: 1px solid rgba(148,163,184,.4); font-weight: 500; }
.pd-doc-btn.ghost:hover { border-color: currentColor; background: rgba(148,163,184,.08); color: inherit; }
.pd-doc-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: 26px; min-height: 26px; border: none; background: none; border-radius: .3rem; color: inherit; opacity: .7; cursor: pointer; text-decoration: none; }
.pd-doc-icon:hover { opacity: 1; background: rgba(148,163,184,.12); }
.pd-doc-btn { border: none; cursor: pointer; }

/* ── Publication modal (public / restreint par rôles) ── */
.pd-drive-publish { max-width: 460px; width: 92vw; }
.pd-drive-publish-body { display: flex; flex-direction: column; gap: .55rem; padding: .2rem .15rem 0; }
.pd-drive-publish-warn { margin: 0; font-size: .85rem; padding: .5rem .65rem; border-radius: .45rem; background: color-mix(in srgb, #e5a84b 14%, transparent); border: 1px solid color-mix(in srgb, #e5a84b 45%, transparent); }
.pd-drive-publish-label { font-size: .84rem; font-weight: 600; display: flex; align-items: center; gap: .3rem; }
.pd-drive-publish-chips { display: flex; flex-wrap: wrap; gap: .3rem; }
.pd-drive-publish-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .18rem .55rem; border-radius: 999px; font-size: .78rem; background: color-mix(in srgb, var(--pd-emerald, #1AD598) 14%, transparent); color: var(--pd-ink, #0B7A57); border: 1px solid color-mix(in srgb, var(--pd-emerald, #1AD598) 40%, transparent); }
.pd-drive-publish-chip button { background: none; border: none; padding: 0; cursor: pointer; color: inherit; font-size: .9rem; line-height: 1; }
.pd-drive-publish-chip button:hover { color: #e5484d; }
.pd-drive-publish-roles { display: flex; flex-direction: column; max-height: 210px; overflow-y: auto; border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .45rem; }
.pd-drive-publish-role { display: flex; align-items: center; gap: .5rem; padding: .32rem .6rem; font-size: .84rem; cursor: pointer; margin: 0; }
.pd-drive-publish-role:hover { background: var(--surface-2, rgba(148,163,184,.1)); }
.pd-drive-publish-role input { accent-color: var(--pd-ink, #0B7A57); }

/* "Restreint : rôles" tag on published rows (Publics view) */
.pd-badge.restricted { background: color-mix(in srgb, #e5a84b 18%, transparent); color: color-mix(in srgb, #8a5a00 85%, var(--fg, #1e293b)); border: 1px solid color-mix(in srgb, #e5a84b 50%, transparent); }

/* ── Widget: thumbnails, ZIP, restricted placeholder ── */
.pd-doc-thumb { width: 30px; height: 30px; object-fit: cover; border-radius: .3rem; flex: none; }
.pd-doc-thumb.card { width: 48px; height: 48px; border-radius: .45rem; }
.pd-doc-zip { padding: .45rem 0 0; }
.pd-doc-restricted { display: flex; align-items: center; gap: .6rem; padding: .65rem .9rem; border: 1px dashed rgba(148,163,184,.45); border-radius: .55rem; font-size: .88rem; max-width: 560px; flex-wrap: wrap; }
.pd-doc-restricted svg { flex: none; opacity: .65; }
.pd-doc-restricted .pd-doc-btn { margin-left: auto; }

/* Publication options (download / expiry) */
.pd-drive-publish-opts { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; }
.pd-drive-publish-opt { display: flex; align-items: center; gap: .4rem; font-size: .84rem; margin: 0; cursor: pointer; }
.pd-drive-publish-opt input[type="checkbox"] { accent-color: var(--pd-ink, #0B7A57); }
.pd-drive-publish-date { padding: .2rem .35rem; border: 1px solid var(--border, rgba(148,163,184,.3)); border-radius: .35rem; background: var(--surface, transparent); color: inherit; font-size: .8rem; }
.pd-badge.expired { background: color-mix(in srgb, #e5484d 15%, transparent); color: #c73a3f; border: 1px solid color-mix(in srgb, #e5484d 45%, transparent); }

/* Own publications stand out in the Publics view */
.pd-drive-mine { color: var(--pd-ink, #0B7A57); font-weight: 600; }

/* Embedded explorer (page-builder DriveExplorer widget) — account styles are
   scoped under .pal-account-wrap on /account; give the bare embed the vars. */
.pd-drive-embed { max-width: 1200px; margin: 0 auto; padding: .5rem 1rem 1.5rem; }