/* file: web/style/components.links.css */

.bd-links-visibility-group{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.bd-links-visibility-group .btn{
  min-width: 110px;
}
.bd-links-form{
  gap: 0;
}
.bd-links-form-main{
  display:block;
}
.bd-links-form-panel{
  margin-top: 16px;
  padding: 14px;
  border: 1px solid #d9e6d4;
  border-radius: 14px;
  background: linear-gradient(180deg, #f8fbf7 0%, #ffffff 100%);
}
.bd-links-form-options{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.bd-links-check-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding: 10px 12px;
  border: 1px solid #d8e3ee;
  border-radius: 12px;
  background:#f8fbff;
  color:#24364d;
}
.bd-links-check-row input{
  margin-top: 2px;
  flex: 0 0 auto;
}
.bd-links-check-row span{
  line-height: 1.35;
}
.bd-links-form-meta{
  margin-top: 16px;
}
.bd-links-form-actions{
  margin-top: 18px;
  padding-top: 12px;
  border-top: 1px solid #e4ece1;
}
.bd-links-trash-form{
  padding-top: 4px;
}
.bd-link-status-ok{
  background: #eaf7ea;
  border-color: #b9dfba;
  color: #1f5b2a;
}
.bd-link-status-bad{
  background: #ffeaea;
  border-color: #f2bbbb;
  color: #842029;
}
.bd-links-top-tabs .bd-tab-main{
  font-size: 16px;
  padding: 10px 14px;
  border-radius: 999px;
}
.bd-links-manage-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin: 6px 0 12px;
}
.bd-links-manage-tabs{
  flex:1 1 auto;
}
.bd-links-kpis{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}
.bd-links-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin: 0 0 12px;
}
.bd-links-quicksearch{
  display:flex;
  align-items:center;
  gap:10px;
  flex:1 1 auto;
}
.bd-links-quicksearch-inline{
  min-width:0;
}
.bd-links-quicksearch .input{
  flex:1 1 auto;
}
.bd-links-viewbar{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
  flex-wrap:wrap;
}
.bd-links-search-btn,
.bd-links-new-btn{
  width:46px;
  min-width:46px;
  height:46px;
  justify-content:center;
}
.bd-links-new-btn{
  margin-left:auto;
}
.bd-listmode-pills-inline{
  display:flex;
  align-items:center;
  gap:10px;
}
.bd-filter-details-main{
  border-color:#d4e2cf;
}
.bd-links-form-access-pills{
  margin-top: 8px;
}
.bd-links-filter-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.bd-links-filter-actions .btn{
  width:auto;
}
.bd-links-filter-actions .btn.btn-icon{
  width:44px;
  min-width:44px;
  height:44px;
  justify-content:center;
}
.bd-links-bulk-details{
  margin-top: 10px;
  border: 1px solid #d9e6d4;
  border-radius: 12px;
  background: #f8fbf7;
}
.bd-links-bulk-details summary{
  cursor:pointer;
  list-style:none;
  padding: 11px 12px;
  font-weight:700;
  color:#264226;
  display:flex;
  align-items:center;
  gap:10px;
}
.bd-links-bulk-details summary::-webkit-details-marker{
  display:none;
}
.bd-links-bulk-details .bd-bulk-form{
  padding: 0 12px 12px;
}
.bd-links-top-tabs .bd-tab-main.bd-tab-new{
  background: #e8f8e8;
  border-color: #a8dca8;
  color: #1f5d1f;
}
.bd-links-top-tabs .bd-tab-main.bd-tab-new.is-current{
  background: #d9f2d9;
  border-color: #8ec78e;
}
.bd-links-kpis .bd-kpi-pill{
  font-size: 13px;
  padding: 5px 9px;
}
.bd-links-empty{
  padding: 18px 16px;
  border: 1px dashed #cadbc5;
  border-radius: 14px;
  background:#f8fbf7;
  color:#355135;
}
.bd-links-empty.bd-links-empty-soft{
  margin-top: 4px;
  background:#fbfcfb;
  border-style:solid;
}
.bd-links-empty-title{
  font-size: 19px;
  font-weight: 800;
  line-height:1.3;
}
.bd-links-empty-text{
  margin-top: 6px;
  color:#577157;
  line-height:1.45;
}
.bd-links-empty-actions{
  margin-top: 12px;
}
.bd-link-meta-pills{
  gap:6px;
}
.bd-link-meta-pills .dash-pill{
  padding:4px 8px;
  font-size:12px;
}
.bd-link-permission-pill{
  font-weight: 700;
}
.bd-link-permission-pill.is-manage{
  color: #0f5132;
  border-color: #b6dfc8;
  background: #eefaf2;
}
.bd-link-permission-pill.is-read{
  color: #5e4710;
  border-color: #ead9a3;
  background: #fff8e8;
}
.bd-link-visibility-pill{
  color: #4e3e78;
  border-color: #d2c7ef;
  background: #f6f2ff;
}
.bd-link-access-meta{
  margin-top: 0;
}
.bd-doc-item{
  padding: 10px 12px;
  border: 1px solid #d9e6d4;
  border-radius: 16px;
  background: linear-gradient(180deg, #fbfcf7 0%, #ffffff 100%);
}
.bd-doc-head{
  display:grid;
  grid-template-columns: 34px minmax(0, 1fr) max-content;
  align-items:flex-start;
  gap:10px;
}
.bd-doc-select-col{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top: 4px;
  width:34px;
}
.bd-doc-head-left{
  flex:1 1 auto;
  min-width:0;
}
.bd-doc-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.bd-doc-row + .bd-doc-row{
  margin-top: 4px;
}
.bd-doc-title{
  display:flex;
  align-items:flex-start;
  gap:10px;
  min-width:0;
}
.bd-doc-title-inline{
  flex:1 1 auto;
}
.bd-doc-title-link{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size: 16px;
  line-height: 1.3;
  font-weight: 800;
  color:#1d2b1d;
  text-decoration:none;
}
.bd-doc-title-link:hover,
.bd-doc-title-link:focus{
  text-decoration:underline;
}
.bd-doc-actions-top{
  display:flex;
  align-items:flex-start;
  gap:8px;
  justify-self:end;
  width:max-content;
  padding-top: 2px;
}
.bd-doc-edit-btn{
  flex:0 0 auto;
  min-width:42px;
  height:42px;
}
.bd-doc-row-sub{
  align-items:flex-start;
}
.bd-doc-row-sub-left{
  display:flex;
  align-items:flex-start;
  min-width:0;
  flex:1 1 auto;
}
.bd-doc-pin-form{
  flex:0 0 auto;
}
.bd-doc-pin-btn{
  min-width:28px;
  height:42px;
  padding:0 8px;
  border-radius:12px;
  border:1px solid #d9cfa8;
  background:#f5efe0;
  color:#7a6320;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.bd-doc-pin-btn.is-active{
  border-color:#b8962f;
  background:#ead389;
  color:#6f5200;
}
.bd-doc-url{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  line-height:1.2;
}
.bd-doc-status-icon{
  flex:0 0 auto;
  font-size:15px;
  line-height:1;
}
.bd-doc-status-icon.is-ok{
  color:#1f7a39;
}
.bd-doc-status-icon.is-bad{
  color:#b42318;
}
.bd-doc-status-icon.is-neutral{
  color:#7a7a7a;
}
.bd-doc-teaser{
  font-size: 12px;
  line-height: 1.35;
  color:#4d654d;
}
.bd-doc-row-desc,
.bd-doc-row-visibility{
  padding-left: 0;
}
.bd-link-access-meta-visible{
  font-size:12px;
  line-height:1.4;
}
.bd-link-access-meta-visible.scope-all{
  color:#1f5d1f;
}
.bd-link-access-meta-visible.scope-private{
  color:#8a5a00;
}
.bd-link-access-meta-visible.scope-users,
.bd-link-access-meta-visible.scope-roles{
  color:#4e3e78;
}
.bd-doc-actions-trash{
  margin-top: 8px;
  padding-left: 56px;
}
.bd-doc-item.is-compact .bd-doc-head-left{
  flex:1 1 auto;
  min-width:0;
}
.bd-doc-item.is-compact .bd-link-inline-feedback{
  margin-top: 4px;
}
.bd-group-title{
  margin-bottom: 6px;
}
.bd-group-title-category{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  padding: 10px 12px;
  border-left: 5px solid #6f8f68;
  border-radius: 12px;
  background: linear-gradient(90deg, #edf5ea 0%, #f8fbf7 100%);
  color:#284228;
  font-size: 19px;
  font-weight: 800;
}
.bd-group-title-category span{
  color:#567056;
  font-size:14px;
  font-weight:700;
}
.bd-group-title-category span::before{
  content:"(";
}
.bd-group-title-category span::after{
  content:")";
}
.bd-filter-card{
  background: linear-gradient(180deg, #fbfcfb 0%, #ffffff 100%);
}
.bd-link-inline-feedback{
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid #d8e4ef;
  background: #f8fbff;
  color: #36506b;
  font-size: 13px;
  font-weight: 600;
  opacity: 1;
  transition: opacity .22s ease, transform .22s ease;
}
.bd-link-inline-feedback.is-hide{
  opacity: 0;
  transform: translateY(-3px);
}
.bd-link-inline-feedback.is-success{
  border-color: #b7e4c0;
  background: #edf9f1;
  color: #1f6f3d;
}
.bd-link-inline-feedback.is-error{
  border-color: #e6b8bf;
  background: #fceef0;
  color: #842029;
}
.bd-link-cat-pill{
  border-color:#c8d7c2;
  background:#eef6ea;
  color:#1e293b;
}

@media (max-width: 780px){
  .bd-links-manage-row,
  .bd-links-toolbar{
    flex-direction:column;
    align-items:stretch;
  }
  .bd-links-quicksearch{
    width:100%;
  }
  .bd-links-quicksearch .input{
    width:100%;
    min-width:0;
  }
  .bd-links-viewbar{
    width:100%;
    justify-content:space-between;
  }
  .bd-links-kpis{
    justify-content:flex-start;
  }
  .bd-pinned-grid{
    grid-template-columns:1fr;
  }
  .bd-link-inline-feedback{
    font-size: 12px;
  }
  .bd-links-top-tabs .bd-tab-main{
    font-size: 15px;
    padding: 9px 12px;
  }
  .bd-links-kpis .bd-kpi-pill{
    font-size: 12px;
    padding: 4px 8px;
  }
  .bd-doc-row,
  .bd-doc-row-sub{
    gap:7px;
  }
  .bd-doc-row-desc,
  .bd-doc-row-visibility,
  .bd-doc-actions-trash{
    padding-left: 0;
  }
}

@media (max-width: 700px){
  .bd-links-manage-tabs,
  .bd-links-kpis{
    width:100%;
  }
  .bd-links-viewbar{
    gap:8px;
  }
  .bd-links-search-btn,
  .bd-links-new-btn{
    width:44px;
    min-width:44px;
    height:44px;
  }
  .bd-doc-item.is-compact .bd-doc-actions{
    width:100%;
    justify-content:flex-start;
  }
  .bd-doc-item.is-compact .bd-doc-actions .btn,
  .bd-doc-item.is-compact .bd-doc-actions form{
    flex:0 0 auto;
  }
  .bd-doc-head{
    grid-template-columns: 34px minmax(0, 1fr) max-content;
  }
  .bd-doc-actions-top{
    grid-column: 3;
    justify-content:flex-end;
  }
  .bd-doc-row-main,
  .bd-doc-row-sub{
    align-items:flex-start;
  }
  .bd-doc-item{
    padding: 9px 10px;
  }
  .bd-doc-title-link,
  .bd-doc-url{
    white-space:normal;
  }
  .bd-doc-pin-btn,
  .bd-doc-edit-btn{
    height:40px;
  }
  .bd-listmode-pills-inline{
    flex:1 1 auto;
    min-width:0;
  }
  .bd-listmode-pills-inline .dash-pill{
    padding-left:10px;
    padding-right:10px;
  }
  .bd-links-empty{
    padding: 14px 12px;
  }
  .bd-links-filter-actions{
    gap:8px;
    flex-wrap:nowrap;
  }
  .bd-links-filter-actions .btn:last-child{
    flex:1 1 auto;
    justify-content:center;
  }
  .bd-links-visibility-group{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .bd-links-visibility-group .btn{
    width:100%;
    min-width:0;
  }
  .bd-links-form-panel{
    padding: 12px;
  }
  .bd-links-form-actions .btn,
  .bd-links-trash-form .btn{
    width:100%;
    justify-content:center;
  }
}