/* MY CODE — My Cloud management dashboard */
.cloud-manager-page { background:linear-gradient(180deg,#fffaf7 0%,#fff 44%); }
.manager-top { padding-top:0; }

#cloudContent {
  width:min(100%,1180px);
  margin-inline:auto;
}

.cloud-account-panel {
  display:grid;
  grid-template-columns:1.5fr .75fr .75fr;
  gap:0;
  margin-bottom:16px;
  overflow:hidden;
  border:1px solid #e9e2dc;
  border-radius:16px;
  background:#fff;
}
.cloud-account-panel > div {
  min-height:126px;
  padding:22px 24px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-right:1px solid #eee8e3;
}
.cloud-account-panel > div:last-child { border-right:0; }
.cloud-account-panel span {
  display:block;
  margin-bottom:10px;
  color:#fb5d00;
  font-size:10px;
  font-weight:700;
  letter-spacing:.1em;
}
.cloud-account-panel strong {
  color:#171717;
  font-size:21px;
  font-weight:550;
  line-height:1.25;
  letter-spacing:-.03em;
}
.cloud-account-main strong { font-size:23px; }
.cloud-account-panel p,
.cloud-account-panel a {
  margin:7px 0 0;
  color:#8f8882;
  font-size:12px;
  line-height:1.5;
}
.cloud-account-panel a { width:max-content; text-decoration:none; color:#6f6964; }
.cloud-account-panel a:hover { color:#fb5d00; }

.cloud-stats {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin:0 0 22px;
}
.cloud-stats article {
  min-height:126px;
  padding:20px 22px;
  border:1px solid #e9e2dc;
  border-radius:15px;
  background:#fff;
}
.cloud-stats span {
  display:block;
  margin-bottom:12px;
  color:#fb5d00;
  font-size:10px;
  font-weight:700;
  letter-spacing:.1em;
}
.cloud-stats strong {
  display:block;
  color:#171717;
  font-size:24px;
  font-weight:540;
  line-height:1.1;
  letter-spacing:-.035em;
}
.cloud-stats p { margin:7px 0 0; color:#918a84; font-size:12px; }

.cloud-manager-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:30px;
  padding:12px;
  border:1px solid #e9e2dc;
  border-radius:14px;
  background:#fff;
}
.cloud-search-wrap { flex:1; min-width:0; }
.cloud-search-wrap input {
  width:100%;
  height:40px;
  padding:0 13px;
  border:1px solid #e7e1dc;
  border-radius:9px;
  background:#fcfbfa;
  color:#27231f;
  font-size:13px;
  outline:none;
}
.cloud-search-wrap input:focus { border-color:#fb5d00; background:#fff; }
.cloud-toolbar-actions { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.cloud-toolbar-actions select {
  height:40px;
  padding:0 32px 0 11px;
  border:1px solid #e7e1dc;
  border-radius:9px;
  background:#fff;
  color:#5f5954;
  font:inherit;
  font-size:12px;
}
.cloud-toolbar-actions .secondary-button { min-height:40px; padding:0 13px; }

.cloud-section-label {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:14px;
}
.cloud-section-label span { color:#fb5d00; font-size:11px; font-weight:700; letter-spacing:.1em; }
.cloud-section-label p { margin:0; color:#918a84; font-size:12px; }

.cloud-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:16px !important; }
.cloud-grid .library-card {
  border:1px solid #ebe5e0 !important;
  border-radius:15px !important;
  overflow:hidden;
  box-shadow:none !important;
  background:#fff;
}
.cloud-grid .library-thumb { aspect-ratio:16 / 10; background:#f5f2ef; cursor:pointer; }
.cloud-grid .library-thumb img { width:100%; height:100%; object-fit:cover; }
.cloud-grid .library-body { padding:18px !important; }
.cloud-grid .library-title { margin-top:7px; font-size:15px !important; line-height:1.4; }
.cloud-grid .library-meta { font-size:10px !important; }
.cloud-grid .library-code-row { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.cloud-grid .copy-button { min-width:0; padding:0 7px !important; white-space:nowrap; font-size:10px !important; }
.cloud-grid .delete-library-button { font-size:10px !important; }
.cloud-login-card { margin-top:0; }

@media (max-width:1050px) {
  #cloudContent { width:min(100%,900px); }
  .cloud-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .cloud-account-panel { grid-template-columns:1fr 1fr; }
  .cloud-account-main { grid-column:1 / -1; border-right:0 !important; border-bottom:1px solid #eee8e3; }
}
@media (max-width:820px) {
  .cloud-stats { grid-template-columns:1fr; }
  .cloud-manager-toolbar { align-items:stretch; flex-direction:column; }
  .cloud-toolbar-actions { flex-wrap:wrap; }
  .cloud-toolbar-actions select { flex:1; min-width:150px; }
  .cloud-section-label { align-items:flex-start; flex-direction:column; gap:5px; }
}
@media (max-width:620px) {
  .cloud-account-panel { grid-template-columns:1fr; }
  .cloud-account-panel > div,
  .cloud-account-main { grid-column:auto; border-right:0 !important; border-bottom:1px solid #eee8e3; }
  .cloud-account-panel > div:last-child { border-bottom:0; }
  .cloud-grid { grid-template-columns:1fr !important; }
  .cloud-toolbar-actions { display:grid; grid-template-columns:1fr 1fr; }
  .cloud-toolbar-actions .library-status-line { grid-column:1 / -1; }
}
