/* Copyright (c) 2026 Tekkis Corporation. All rights reserved.
   Proprietary and Confidential. Unauthorized copying, distribution, modification,
   disclosure, or use is prohibited without prior written authorization from Tekkis Corporation. */

body {
  min-height: 100vh;
}

.portal-card {
  border-radius: 1rem;
}

.portal-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 0.75rem;
  background: #212529;
  color: #fff;
  font-size: 1.35rem;
  font-weight: 700;
}

.action-name {
  width: 12rem;
}

.navbar { min-height: 3.75rem; }
.user-pill { font-size: .875rem; color: rgba(255,255,255,.8); }
.upload-zone { min-height: 8.4rem; border: 2px dashed #adb5bd; border-radius: 1rem; background: #fff; display:flex; align-items:center; justify-content:center; gap:1rem; padding:1.5rem; cursor:pointer; transition:border-color .15s, background .15s; }
.upload-zone:hover, .upload-zone.drag-over { border-color:#0d6efd; background:#f8fbff; }
.upload-icon { width:2.8rem; height:2.8rem; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#e9ecef; font-size:1.5rem; font-weight:700; }
.file-link { display:inline-flex; align-items:center; gap:.65rem; text-decoration:none; color:inherit; }
.file-link:hover span:last-child { text-decoration:underline; }
.file-icon { width:1.75rem; height:1.75rem; border-radius:.4rem; display:inline-flex; align-items:center; justify-content:center; background:#e9ecef; color:#495057; font-size:.85rem; }
.folder-icon { background:#fff3cd; color:#856404; }
.file-table td, .file-table th { padding:.85rem 1rem; }
.action-menu { position:relative; display:inline-block; }
.action-menu summary { list-style:none; cursor:pointer; }
.action-menu summary::-webkit-details-marker { display:none; }
.action-panel { position:absolute; z-index:20; right:0; top:calc(100% + .35rem); width:18rem; padding:.85rem; background:#fff; border:1px solid #dee2e6; border-radius:.75rem; text-align:left; }
.empty-icon { font-size:2rem; }
@media (max-width: 575.98px) { .action-panel { position:fixed; left:1rem; right:1rem; bottom:1rem; top:auto; width:auto; } }

/* Stage 6.1 application navigation and workspace */
.svg-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.ui-icon { width:1em; height:1em; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; vertical-align:-.125em; }
.ui-icon circle { fill:none; }
.brand-subtitle { font-weight:400; color:rgba(255,255,255,.72); }
.nav-app-link { display:inline-flex; align-items:center; gap:.4rem; color:rgba(255,255,255,.72); text-decoration:none; font-size:.92rem; }
.nav-app-link:hover, .nav-app-link.active { color:#fff; }
.account-menu { position:relative; color:#fff; }
.account-menu > summary { list-style:none; display:flex; align-items:center; gap:.45rem; padding:.4rem .65rem; border-radius:.5rem; cursor:pointer; font-size:.9rem; }
.account-menu > summary::-webkit-details-marker { display:none; }
.account-menu > summary:hover, .account-menu[open] > summary { background:rgba(255,255,255,.1); }
.menu-caret { font-size:.72rem; opacity:.7; }
.account-panel { position:absolute; z-index:50; right:0; top:calc(100% + .45rem); width:14rem; padding:.45rem; background:#fff; color:#212529; border:1px solid #dee2e6; border-radius:.75rem; }
.account-identity { padding:.55rem .65rem; display:flex; flex-direction:column; line-height:1.25; }
.account-identity span { color:#6c757d; font-size:.78rem; margin-top:.15rem; }
.account-divider { height:1px; background:#e9ecef; margin:.3rem .25rem; }
.account-panel a, .account-panel button { width:100%; display:flex; align-items:center; gap:.6rem; padding:.5rem .65rem; border:0; border-radius:.45rem; background:transparent; color:#212529; text-decoration:none; text-align:left; font-size:.9rem; }
.account-panel a:hover, .account-panel button:hover { background:#f1f3f5; }
.account-panel form { margin:0; }
.file-browser-card { min-height:20rem; }
.actions-sidebar { position:sticky; top:1.25rem; }
.sidebar-heading-icon { font-size:1.1rem; color:#6c757d; }
.upload-zone { min-height:10.5rem; flex-direction:column; gap:.65rem; padding:1.25rem; }
.upload-svg { font-size:2rem; color:#6c757d; }
.new-folder-panel { overflow:hidden; }
.new-folder-panel > summary { list-style:none; display:flex; align-items:center; gap:.65rem; padding:1rem 1.1rem; cursor:pointer; font-weight:600; }
.new-folder-panel > summary::-webkit-details-marker { display:none; }
.new-folder-panel > summary:hover { background:#f8f9fa; }
.new-folder-body { border-top:1px solid #e9ecef; padding:1rem 1.1rem 1.1rem; }
.empty-icon .ui-icon { width:2rem; height:2rem; }
@media (max-width: 991.98px) { .actions-sidebar { position:static; } }
@media (max-width: 575.98px) { .brand-subtitle { display:none; } .navbar .container { gap:.75rem; } .nav-app-link { display:none; } .account-panel { position:fixed; left:1rem; right:1rem; top:4rem; width:auto; } }

/* Stage 6.2 polish */
.portal-page { min-height:100vh; display:flex; flex-direction:column; }
.portal-main { flex:1 0 auto; width:100%; }
.portal-page > footer { flex-shrink:0; width:100%; text-align:center; }
.action-section .card-header { border-bottom:1px solid #e9ecef; }
.file-choice { color:#212529; text-align:left; }
.selected-file { display:flex; justify-content:space-between; gap:.75rem; padding:.28rem .5rem; margin-top:.25rem; background:#f8f9fa; border-radius:.4rem; font-size:.86rem; font-weight:600; }
.selected-file span:last-child { color:#6c757d; font-weight:400; white-space:nowrap; }
.selected-count { margin-top:.55rem; font-size:.8rem; font-weight:600; color:#495057; text-align:center; }
.progress { height:1.15rem; }


/* v0.7.4: let the flex page layout reserve natural space for the footer. */
@media (min-width: 992px) {
  .file-browser-workspace {
    overflow: visible;
  }
  .file-browser-workspace > table { margin-bottom: 0; }
}

/* v0.6.10 native modal dialogs; no Bootstrap JavaScript dependency. */
.portal-dialog {
  width: min(32rem, calc(100vw - 2rem));
  max-width: 32rem;
  padding: 0;
  border: 0;
  border-radius: .5rem;
  background: transparent;
  box-shadow: 0 1rem 3rem rgba(0,0,0,.25);
}
.portal-dialog::backdrop {
  background: rgba(0,0,0,.5);
}
.portal-dialog .modal-content {
  background: var(--bs-body-bg);
  border: var(--bs-border-width) solid var(--bs-border-color-translucent);
  border-radius: .5rem;
}
