/* EASHR unified design tokens and flat dark surface — October 2026 */
:root{--e-indigo:#818cf8;--e-indigo-light:#a5b4fc;--e-surface:rgba(11,17,29,.38);--e-border:rgba(184,207,239,.17);--e-focus:rgba(129,140,248,.65);--cyan:var(--e-indigo)}
.transfer :is(input:not([type=checkbox]),select,textarea),.transfer .e-ui-input{appearance:none;display:block;width:100%;min-width:0;background:var(--e-surface)!important;color:#e9f1fc!important;border:1px solid var(--e-border)!important;border-radius:5px!important;padding:11px!important;box-shadow:none!important;font:inherit;outline:none}
.transfer :is(input,select,textarea)::placeholder{color:rgba(196,210,232,.44)}
.transfer :is(input,select,textarea):focus-visible,.transfer button:focus-visible{outline:2px solid var(--e-focus);outline-offset:2px}
.transfer :is(button,a):not(.file-action):hover{border-color:rgba(165,180,252,.32)}
.transfer :is(.navigation,.tabs,.drop,.actions,.zonebar,.profile-chip,.row-head,.eashr-connect-top,.eashr-connect-step-head) i{color:var(--e-indigo-light)}
.transfer .tabs button.active{border-bottom-color:var(--e-indigo);color:#f8faff}
.transfer .drop{border-color:rgba(129,140,248,.45)}.transfer .drop:hover{background:rgba(129,140,248,.07)}
.transfer .upload-bar>div{background:var(--e-indigo)}
.transfer #accountSettings{min-width:0;width:100%;overflow-wrap:anywhere}
.transfer #settings{gap:12px;align-items:stretch}
.transfer #settings > *,#settings .account-settings,#accountForm{min-width:0;width:100%;max-width:100%}
.transfer #settings button{margin-top:0;max-width:100%}
.transfer #settings .overlay-head button{width:auto;flex:none}
.transfer #accountForm{display:grid;grid-template-columns:minmax(0,1fr);gap:9px}
.transfer #accountEmail{width:100%;min-width:0}
.transfer .eashr-connect-banner{background:rgba(7,12,23,.19)!important;border:1px solid rgba(184,207,239,.09)!important;border-radius:5px}
.transfer .eashr-connect-banner:hover{background:rgba(9,15,27,.36)!important;border-color:rgba(165,180,252,.25)!important}
.transfer .eashr-connect-banner>i:first-child{color:var(--e-indigo-light)}
.transfer .eashr-connect-choices{gap:13px}
.transfer .e-ui-panel{position:absolute;inset:0;z-index:31;display:flex;flex-direction:column;gap:12px;padding:18px 21px;overflow-y:auto;scrollbar-width:thin;background:rgba(17,22,33,.985);backdrop-filter:blur(20px);border-radius:inherit;color:#eaf1ff}
.transfer .e-ui-panel[hidden]{display:none!important}
.e-ui-titlebar{display:flex;gap:10px;align-items:center;padding-bottom:12px;border-bottom:1px solid var(--e-border)}
.e-ui-titlebar h2{margin:0;font-size:16px;font-weight:650;flex:1}
.transfer .e-ui-back{width:auto!important;flex:none;background:transparent!important;border:0!important;padding:5px!important;font-size:18px}
.e-ui-description{color:#aebbd0;font-size:11px;line-height:1.5;margin:0}
.e-ui-group{display:flex;flex-direction:column;gap:9px;min-width:0}
.e-ui-group label{font-size:11px;color:#c8d3e5}
.e-ui-surface{background:rgba(9,15,26,.22);border:1px solid rgba(184,207,239,.09);border-radius:5px;padding:12px}
.e-ui-tile{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:14px 11px;background:rgba(8,13,24,.21)!important;border:1px solid rgba(184,207,239,.09)!important;border-radius:5px!important}
.e-ui-tile:hover{background:rgba(10,16,29,.45)!important}
.e-ui-tile>i{font-size:22px;color:var(--e-indigo-light)}
.e-ui-tile strong{display:block;font-size:12px;font-weight:650}
.e-ui-tile small{display:block;color:#aab7cd;font-size:10px;margin-top:3px}
.e-ui-tile .ri-check-line{margin-left:auto;color:var(--e-indigo-light)}
.e-ui-tabs{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.e-ui-tabs button{background:transparent!important;border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;font-size:12px;color:#bac5d8}
.e-ui-tabs button.active{border-bottom-color:var(--e-indigo)!important;color:white}
.e-ui-primary{background:rgba(80,92,161,.35)!important;border:1px solid rgba(165,180,252,.22)!important;color:#f2f4ff!important;padding:11px!important;border-radius:5px!important}
.e-ui-secondary{background:rgba(8,14,27,.3)!important;border:1px solid var(--e-border)!important;padding:10px!important;border-radius:5px!important}
.e-ui-buttons{display:flex;flex-wrap:wrap;gap:7px}.e-ui-buttons>*{flex:1;min-width:0}
.e-ui-qr{display:grid;place-items:center;align-self:center;padding:10px;background:#202936;border-radius:5px;min-height:208px;min-width:208px}
.e-ui-qr canvas,.e-ui-qr img{max-width:192px!important;max-height:192px!important}
.e-ui-note{font-size:11px;color:#aab9d0}
#zones{display:none!important}
#zonePickerButton{flex:1;min-width:0;display:flex;align-items:center;gap:8px;justify-content:space-between;text-align:left;overflow:hidden}
#zonePickerButton span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#zonePickerButton i{color:var(--e-indigo-light)}
#eashrZoneRename{display:none!important}
.transfer .e-ui-panel button:disabled{opacity:.48}

/* Share screen: the QR is the primary action, PIN is opt-in. */
.transfer .e-share-content{gap:11px;align-items:stretch}
.transfer .e-share-qr{background:#fff;min-width:214px;min-height:214px;padding:11px;margin:2px auto 0}
.transfer .e-share-qr img,.transfer .e-share-qr canvas{width:192px!important;height:192px!important}
.transfer .e-share-countdown{text-align:center;margin:0;min-height:20px}
.transfer .e-share-toggle{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;font-size:12px;color:#dbe5f8}
.transfer .e-share-toggle input[type=checkbox]{appearance:none;width:39px;height:22px;min-width:39px;position:relative;border-radius:20px;background:#354054;border:1px solid rgba(184,207,239,.28);cursor:pointer;transition:background .15s}
.transfer .e-share-toggle input[type=checkbox]::before{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#f1f5ff;transition:transform .15s}
.transfer .e-share-toggle input[type=checkbox]:checked{background:#6774db}
.transfer .e-share-toggle input[type=checkbox]:checked::before{transform:translateX(17px)}
.transfer .e-share-toggle input[type=checkbox]:focus-visible{outline:2px solid #a5b4fc;outline-offset:3px}
.transfer .e-share-pin{margin:0;color:#d7dfff}
.transfer .e-share-pin[hidden]{display:none!important}
.transfer .e-share-actions,.transfer .e-share-channels{display:flex;flex-wrap:wrap;gap:8px}
.transfer .e-share-actions>*{flex:1 1 125px}
.transfer .e-share-channels>*{flex:1 1 110px}

/* Zone heading: an unboxed section title, not a select/input field. */
.transfer .zonebar{display:flex;align-items:center;gap:12px;min-height:49px;margin:10px 0 8px}
.transfer .zonebar #zonePickerButton{
 flex:1 1 auto;display:flex;align-items:center;justify-content:flex-start;
 gap:10px;min-width:0;min-height:47px;margin:0;padding:1px 0;
 background:transparent!important;border:0!important;border-radius:0!important;
 box-shadow:none!important;color:#f2f3ff;text-align:left;
}
.transfer .zonebar #zonePickerButton:hover{background:transparent!important;border:0!important}
.transfer .zonebar #zonePickerButton>i:first-child{font-size:23px;flex:0 0 27px;color:var(--e-indigo-light)}
.transfer .zonebar #zonePickerButton .e-zone-title-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:0;flex:0 1 auto}
.transfer .zonebar #zonePickerButton .e-zone-title-copy small{font-size:10px;font-weight:500;line-height:1.2;color:#aeb9dc}
.transfer .zonebar #zonePickerButton .e-zone-title-copy strong{font-size:17px;line-height:1.3;font-weight:650;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.transfer .zonebar #zonePickerButton>i:last-child{flex:0 0 auto;font-size:18px;margin-left:0;color:var(--e-indigo-light)}
.transfer .zonebar #create{
 display:grid;place-items:center;flex:0 0 38px;
 width:38px!important;height:38px!important;min-width:38px;min-height:38px;
 margin:0;padding:0!important;border-radius:50%!important;
 border:1px solid rgba(165,180,252,.26)!important;
 background:rgba(86,92,151,.16)!important;color:#e6eaff;
 box-shadow:none!important;
}
.transfer .zonebar #create i{font-size:20px;line-height:1}
.transfer .zonebar #create:disabled{cursor:not-allowed;opacity:.40}
.transfer .zonebar #create:not(:disabled):hover{background:rgba(129,140,248,.24)!important;border-color:rgba(165,180,252,.55)!important}

/* Zone title: compact inline label, name and chevron on one baseline. */
.transfer .zonebar #zonePickerButton .e-zone-title-copy{
 display:flex;flex-direction:row;align-items:baseline;gap:7px;
 min-width:0;flex:0 1 auto;
}
.transfer .zonebar #zonePickerButton .e-zone-title-copy small{
 font-size:12px;font-weight:400;color:#acb9d2;white-space:nowrap;
}
.transfer .zonebar #zonePickerButton .e-zone-title-copy strong{
 font-size:16px;font-weight:650;
}
.transfer .zonebar #create{
 display:flex!important;align-items:center!important;justify-content:center!important;
 padding:0!important;line-height:1!important;border-radius:50%!important;
}
.transfer .zonebar #create i{
 display:block;font-size:20px;line-height:1!important;
 height:20px;width:20px;text-align:center;margin:0!important;
}
/* Zone directory: one timeline-ordered list with separate left-hand settings menu. */
.transfer .e-zone-directory{gap:7px;overflow-y:auto;min-height:0;max-height:100%;padding:1px 0 4px}
.transfer .e-zone-directory-row{display:flex;align-items:stretch;gap:7px;min-width:0}
.transfer .e-zone-directory-settings{
 flex:0 0 35px;width:35px;min-width:35px;display:grid;place-items:center;
 background:rgba(17,25,42,.22)!important;border:1px solid rgba(184,207,239,.12)!important;
 border-radius:5px!important;color:#aabaf0;padding:0!important;
}
.transfer .e-zone-directory-settings i{font-size:18px}
.transfer .e-zone-directory-select{
 flex:1 1 auto;display:flex;align-items:center;gap:11px;min-width:0;
 padding:11px 10px!important;text-align:left;
 background:rgba(8,13,24,.21)!important;border:1px solid rgba(184,207,239,.12)!important;
 color:#eaf1ff;border-radius:5px!important;
}
.transfer .e-zone-directory-select:hover{background:rgba(80,92,161,.17)!important}
.transfer .e-zone-directory-select>i:first-child{font-size:18px;flex:0 0 20px;color:#a5b4fc}
.transfer .e-zone-directory-copy{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1 1 auto}
.transfer .e-zone-directory-copy strong{font-size:12px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.transfer .e-zone-directory-copy small{font-size:10px;font-weight:400;line-height:1.4;color:#acb9d2;overflow-wrap:anywhere}
.transfer .e-zone-directory-active{flex:0 0 auto;color:#a5b4fc;font-size:16px}

/* Flat Zone directory — rows behave like a list, not a stack of cards. */
.transfer .e-zone-directory{
 display:block;flex:1 1 auto;overflow-y:auto;min-height:0;max-height:none;
 padding:0;margin:1px 0 0;border-top:1px solid rgba(184,207,239,.14);
}
.transfer .e-zone-directory-row{
 display:flex;align-items:center;gap:0;min-height:65px;
 padding:0;border-bottom:1px solid rgba(184,207,239,.13);
 background:transparent;border-radius:0;
}
.transfer .e-zone-directory-row.is-selected{background:rgba(99,102,241,.055)}
.transfer .e-zone-directory-select{
 flex:1 1 auto;display:flex;align-items:center;gap:11px;
 min-width:0;min-height:64px;padding:10px 6px!important;
 background:transparent!important;border:0!important;border-radius:0!important;
 box-shadow:none!important;text-align:left;
}
.transfer .e-zone-directory-select:hover{
 background:rgba(129,140,248,.055)!important;border:0!important;
}
.transfer .e-zone-directory-select:focus-visible,
.transfer .e-zone-directory-settings:focus-visible{
 outline:2px solid rgba(165,180,252,.68);outline-offset:-2px;
}
.transfer .e-zone-directory-settings{
 order:2;flex:0 0 34px;display:flex;align-items:center;justify-content:center;
 width:34px;min-width:34px;height:40px;
 margin:0 0 0 2px;padding:0!important;
 background:transparent!important;border:0!important;border-radius:50%!important;
 box-shadow:none!important;color:#aebcf0;
}
.transfer .e-zone-directory-settings:hover{
 background:rgba(129,140,248,.12)!important;border:0!important;
}
.transfer .e-zone-directory-select>i:first-child{flex:0 0 20px}
.transfer .e-zone-directory-copy{gap:3px}
.transfer .e-zone-directory-active{margin-left:auto}

/* File options share the existing App Window modal system. */
.transfer .e-file-action-page{gap:10px}
.transfer .e-file-action-name{font-size:13px;line-height:1.5;overflow-wrap:anywhere;color:#eef0ff}
.transfer .e-file-action-page .e-ui-danger{border-color:rgba(234,145,160,.32)!important;color:#ffc3ca!important}
.transfer .e-file-action-page button:disabled{opacity:.48;cursor:not-allowed}