/**
  ToolboxSync: Listing of tree of directories
  Written by (c) Petko Yotov 2021-2022   www.pmwiki.org/Petko

  This text is written for PmWiki; you can redistribute it and/or modify
  it under the terms of the GNU General Public License as published
  by the Free Software Foundation; either version 3 of the License, or
  (at your option) any later version. See pmwiki.php for full details
  and lack of warranty.
*/

.synctable input[type="radio"] {
  display: none;
}

.synctable input[type="radio"] + label {
  display: inline-block;
  border: 1px solid var(--link-color);
  text-align: center;
  
  border-radius: 3px;
  line-height: 1.7em;
/*   padding: 3px 3px; */
  font-size: 90%;
  user-select: none;
  cursor: pointer;
}

.synctable input[type="radio"]:checked + label {
  background-color: var(--theme-color);
  color: var(--bgcolor);
  font-weight: bold;
}

.synctable input[type="radio"]:not(:checked) + label:hover {
  background-color: var(--theme-color-light);
}

#xmonth, #xyear {
  width: 5em;
}
.synctable .zyears {
  position: relative;
}

.synctable .zyears:after,
.synctable .zyears:before {
  position: absolute;
  right: 3px;
  line-height: 1;
  color: #999;
  font-size: .9em;
}

.synctable .zyears:before {
  top: 0;
  content: "↑";
}
.synctable .zyears:after {
  bottom: 5px;
  content: "↓";
}
.synctable .zbuttons > p,
.synctable .zyears > p,
.synctable .ybreak,
.synctable .zmonths > p {
  display: grid;
  grid-gap: 4px;
  padding-right: 1rem;
  grid-template-columns: auto auto auto auto auto auto;
}

.synctable, .synctable * {
  box-sizing: border-box;
}
.synctable .zyears > p.yearsnapscroll {
  height: 58px;
  overflow-y: scroll;
  grid-template-columns: auto;
  scroll-snap-type: y mandatory;
/*   scroll-padding-top: 30px; */
}

.synctable .ybreak {
  grid-template-columns: auto auto auto auto auto;
  scroll-snap-align: center;
  padding-right: 0;
}


td.zbuttons {
  width: 4.4em;
}

.synctable.singleitem td.zbuttons {
  display: none;
}

.synctable #dscounter {
  display: inline-block;
  text-align: center;
}

.synctable .zbuttons > p {
  grid-template-columns: auto;
}

@media (max-width: 600px) {  
  .synctable .zyears > p,
  .synctable .zmonths > p {
    grid-template-columns: auto auto auto auto;
  }
}

@media (max-width: 411px) {  
  .synctable .zyears > p,
  .synctable .zmonths > p {
    grid-template-columns: auto auto auto;
  }
}



.synctabletop td.cdate {
  font-size: .9rem;
  text-align: center;
  width: 7rem;
}

table.synctabletop,
table.synctable {
  max-width: 100%;
  width: 100%;
}



#keywords,
#xnotes {
  font-family: inherit;
}
#kwmsg b {
  color:red;
  cursor: pointer;
}
#kwmsg b:hover {
  text-decoration: line-through;
}

.carrows {
  width: 5em;
  white-space: nowrap;
}
.cdates {
  width: 5em;
  white-space: nowrap;
}
.cbuttons {
  width: 7rem;
  line-height: 1.7em;
}


#dssave, #ds5ko, #dsNA {
  width: 7rem;
  font-size: 90%;
  padding: 3px;
  margin-bottom: 4px;
}

#ds5ko, #ds5ko:not(.hidden) + #dsNA {
  width: 3.2rem;
}
#ds5ko:not(.hidden) + #dsNA {
  margin-left: .4em;
}
#syncprev, #syncnext{
  width: 1.5rem;
  font-size: 90%;
  padding: 3px;
}




.synctable div.flex > p {
  display: flex;
  justify-content: space-between;
}

.synctable div.flex > p > .elem {
  white-space: nowrap;
}

h4#fname {
  width: 712px;
  max-width: calc(100vw - 11em);
/*   background-color: yellow; */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  direction: rtl;
  text-align: left;
  margin: 0;
}

h4#fname .xparent {
  color: #555;
  font-weight: normal;
}

h4#fname .xparent:after {
  content: ' /';
  font-weight: bold;
  color: red;
}



table.synctable #xtitle {
  width: calc(640px - 7.5em);
  max-width: calc(100vw - 23.5em);
}
#synciframe {
  width: 100%;
  height: calc(100vh - 6em);
  max-height: calc(100vh - 6em);
  border-radius: 0px !important;
  border: 2px dashed red;
}

#synciframe[src="about:blank"] {
  display: none;
}

#synciframe:not([src="about:blank"]) ~ * {
/*   display: none; */
}



#synciframe ~ .frame {
  margin: 2em;
  display: none;
}

.wikisyncdate[data-nomorefiles="1"] #synciframe ~ .nomorefiles {
  display: block;
}

.wikisyncdate[data-nomorefiles=""] #synciframe[src="about:blank"] ~ .unpreviewable {
  display: block;
}

#currentexpdate {
  font-weight: bold;
}

#dscounter {
  cursor: pointer;
}
#dscounter:hover {
  background-color: var(--theme-color-light);
}

#xselect + #dscounter {
  display: none;
}
#xselect {
  width: 3.4rem;
  padding: 2px;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: '';
  font-size: 90%;
}

.synclistwrap  {
  margin-top: 4mm;
}
ul.synclist {
  list-style-type: none;
  margin: .4em 0;
  padding: 0;
}
ul.synclist li {
  border-top: 1px solid var(--ccc);
  padding: 1mm 2mm;
  margin: 0;
}
ul.synclist li s {
  display:none;
}

ul.synclist li a[href="#"] {
  color: var(--text-color);
  cursor: default;
}

ul.synclist li  .xnote {
  display: block;
  margin-left: 1em;
  color: var(--text-color);
  font-style: italic;
  font-size: 90%;
  padding: 1px 4px;
}

ul.synclist li[data-role="list-divider"] {
  font-weight: bold;
  background-color: var(--eee);
}

ul.synclist li[data-updated]:after {
  content: attr(data-updated);
  margin-left: .4em;
  font-weight: normal;
  font-size: .83em;
}

ul.synclist li div.gp {
  font-weight: normal;
  
}

ul.synclist li div.gp:after {
  content: '/';
}


ul.synclist li a.itemlink:before {
  content: "● ";
}

ul.recentsearch li.unknown:before {
  content: "● ";
  color: #888;
}

ul.recentsearch li.valid:before {
  content: "● ";
  color: var(--link-color);
}

ul.synclist li > a.wrench {
  display: inline-block;
  width: 1em;
  height: 1em;
  background-image: url(/dr-toolbox/pub/skins/drt2020/xwrench.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

 
ul.synclist li a.add.frame {
  font-family: monospace;
  padding: 2px 6px;
  color: var(--text-color);
}

 
ul.synclist li a.add.frame:hover {
  background-color: var(--theme-color-light);
}

ul.synclist li a.datelink + a:before {
  display: none !important;
}

ul.synclist span.keywords {
  display: none;
}

@media (max-width: 23em) {
  .synclistwrap .syncshow {
    display: block;
  }
}

@media (min-width: 36em) {
  
  ul.synclist:not(.filtered) li a.itemlink:before {
    content: attr(data-mtime);
    float: right;
    font-size: 90%;
  }
  
  
}



ul.synclist li .datelink {
  float: right;
}
ul.synclist li .datelink:after {
  content: attr(data-month);
  font-size: .83rem;
  font-weight: normal;
}

ul.synclist li:hover a.datelink:after {
  background-image: url(/dr-toolbox/pub/skins/drt2020/xwrench.svg);
  background-size: contain;
  background-repeat: no-repeat;
  padding-left: 1.3rem;
}


.llchk_evergreen + label,
.synclistwrap .chk_evergreen + label {
  color: var(--link-color);
}

.llchk_expired + label,
.synclistwrap .chk_expired + label,
ul.synclist li.expired span.datelink:after,
ul.synclist li.expired a:after,
ul.synclist li.expired a:before {
  color: #a00;
}

ul.synclist li.idle {
  color: var(--aaa);
}
ul.synclist li.idle b:before {
  content: '⚠️ ';
}
.groupusers ul.synclist li.pending {
  background-color: var(--bgsalmon);
}

.groupusers li:has(.uchk:checked) {
  background-color: var(--highlight);
}

.llchk_due + label,
.synclistwrap .chk_due + label,
ul.synclist li.due span.datelink:after,
ul.synclist li.due a:after,
ul.synclist li.due a:before {
  color: var(--orangered);
}

.llchk_valid + label,
.synclistwrap .chk_valid + label,
ul.synclist li.valid span.datelink:after,
ul.synclist li.valid a:after,
ul.synclist li.valid a:before {
  color: green;
}

.synclistwrap input[type="checkbox"] {
  margin-left: 1ex;
}

.synclistwrap .chk_recent:checked ~ ul.synclist li:not(.recent),
.synclistwrap .chk_crosslink:not(:checked) ~ ul.synclist li.crosslink,
.synclistwrap .chk_evergreen:not(:checked) ~ ul.synclist li.evergreen,
.synclistwrap .chk_unknown:not(:checked) ~ ul.synclist li.unknown,
.synclistwrap .chk_expired:not(:checked) ~ ul.synclist li.expired,
.synclistwrap .chk_due:not(:checked) ~ ul.synclist li.due,
.synclistwrap .chk_valid:not(:checked) ~ ul.synclist li.valid { 
  display: none; 
}



/* #dsform #addcontrols,  */
#dsform #addcontrols > div.frame > div {
  display: none;
}

#dsform #addcontrols #c_addnote:checked ~  div.frame > div.notes,
#c_addnote:checked ~ .frame #addnote,
#c_addfile:checked ~ .frame #addfile,
#c_addsynclink:checked ~ .frame #addsynclink,
#c_addpagelink:checked ~ .frame #addpagelink,
#c_addvdir:checked ~ .frame #addvdir,
#c_addxlink:checked ~ .frame #addxlink {
  display: block;
  margin-top: 1em;
}

#c_addvdir:checked ~ .frame #extra {
  display:none;
}

#addsynclink .synclistwrap {
  margin-top: 0;
}

#addsynclink .synclistwrap > * {
  display: none;
}

#addsynclink .synclistwrap ul.synclist a.wrench,
#addsynclink .synclistwrap ul.synclist a.datelink,
#addsynclink .synclistwrap ul.synclist a.add  {
  display: none;
}



#addsynclink .synclistwrap > input[type="search"],
#addsynclink .synclistwrap > ul {
  display: initial;
}
#addcontrols label {
  user-select: none;
  cursor: pointer;
}



#addcontrols input:checked + label {
  font-weight: bold;
}

#addcontrols + .synctable h4#fname,
#addcontrols + .synctable tr > td:first-child {
  display: none;
}

table.valign_top td {
  vertical-align: top;
}

#dsform #delitem {
  display: none;
  background-color: #f88;
  float: right;
}


#xdelete {
  background-color: #fa9;
  float: right;
}

ul.synclist li[data-dir^="Pages/"] a.datelink, 
ul.synclist li[data-dir^="Pages/"] a.add  {
  display: none;
}

ul.synclist li[data-jets^="pages/"] a.datelink {
  display: none;
}

@media (min-width: 600px) {
  .searchplussync {
    display: flex;
  }
  
  .searchplussync .synclistwrap {
    max-width: 400px;
  }
}

.synclistwrap.filtered input[type="search"],
.synclistwrap.filtered a[href$="?action=syncdate"],
.synclistwrap.filtered a[href$="?action=synclist"] {
  display: none;
}


a[href$="/.sync/"] {
  color: red;
  background-color: var(--highlight);
}

input[data-jets],
input[data-jets] + input  {
  margin-right: .5em;
}
input[data-jets]:placeholder-shown ~ a.filtersearch {
  display: none;
}


#dssave[data-year="ypast"], #dssave[data-year="ycurrent"][data-month="mpast"],
td[data-year="ycurrent"] input.mpast:not(:checked) + label,
td[data-year="ypast"] input:not(:checked) + label,
input.ypast:not(:checked) + label {
  background-color: #fdd;
}

#dssave[data-year="ycurrent"][data-month="mcurrent"],
td[data-year="ycurrent"] input.mcurrent:not(:checked) + label,
input.ycurrent:not(:checked) + label {
  background-color: #ffa;
}

#dssave[data-year="yfuture"], #dssave[data-year="ycurrent"][data-month="mfuture"],
td[data-year="ycurrent"] input.mfuture:not(:checked) + label,
td[data-year="yfuture"] input:not(:checked) + label,
input.yfuture:not(:checked) + label {
  background-color: #cfc;
}


.synctable td[data-year="ycurrent"] input.mpast:checked + label,
.synctable td[data-year="ypast"] input:checked + label,
.synctable input.ypast:checked + label {
  background-color: #a00;
}

.synctable td[data-year="ycurrent"] input.mcurrent:checked + label,
.synctable input.ycurrent:checked + label {
  background-color: #fa0;
}

.synctable td[data-year="ycurrent"] input.mfuture:checked + label,
.synctable td[data-year="yfuture"] input:checked + label,
.synctable input.yfuture:checked + label {
  background-color: #080;
}


ul.synclist li.highlighted {
  background-color: var(--highlight);
}

ul.synclist li.deleted {
  color: #800;
}
ul.synclist li.deleted a {
  display: none;
}

ul.synclist li.deleted i.fa-trash-can {
  width: 1em;
  color: #888;
}

ul.addkeywords a.added {
  filter: grayscale(1);
  opacity: .5;
}


#wikitext li.crosslink a.itemlink i {
/*   margin-left: .3em; */
  color: orangered;
  font-weight: bold;
}


.wikisyncorphan input:checked + label {
  color: var(--ppp);
  text-decoration: line-through;
}

.wikisyncrecent li[data-role="list-divider"] a.datelink {
  display: none;
}

.syncadded {
  color: #888;
}

#syncorphanform li {
  white-space: pre-wrap;
}