/**
 * This file provides styles for the edit view (?do=edit), preview
 * and section edit buttons.
 */

/* edit view
********************************************************************/

.dokuwiki div.editBox {
}

/*____________ toolbar ____________*/

.dokuwiki div.toolbar {
    display: inline-block;
    margin-bottom: .5em;
}
#draft__status {
    float: right;
    color: @ini_text_alt;
    background-color: inherit;
}
[dir=rtl] #draft__status {
    float: left;
}
#tool__bar {
    float: left;
}
[dir=rtl] #tool__bar {
    float: right;
}

.dokuwiki div.toolbar #tool__bar button.toolbutton .toolicon {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-color: @ini_icons;
    -webkit-mask-image: var(--icon-url);
    mask-image: var(--icon-url);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.dokuwiki div.toolbar #tool__bar button.toolbutton:hover .toolicon,
.dokuwiki div.toolbar #tool__bar button.toolbutton:active .toolicon,
.dokuwiki div.toolbar #tool__bar button.toolbutton:focus .toolicon {
    background-color: @ini_link;
}

/* picker popups (outside of .dokuwiki) */
div.picker {
    width: 300px;
    border: 1px solid @ini_border;
    background-color: @ini_background_alt;
    color: inherit;
}
/* picker for headlines */
div.picker.pk_hl {
    width: auto;
}

/* buttons inside of picker */
div.picker button.pickerbutton,
div.picker button.toolbutton {
    padding: .1em .35em;
    border-width: 0;
}

/*____________ edit textarea ____________*/

.dokuwiki textarea.edit {
    width: 100%;
    margin-bottom: .5em;
    resize: vertical;
}

/*____________ below the textarea ____________*/

.dokuwiki div.editBar {
    overflow: hidden;
    margin-bottom: .5em;
}

/* size and wrap controls */
#size__ctl {
    float: right;
}
[dir=rtl] #size__ctl {
    float: left;
}
#size__ctl img {
    cursor: pointer;
}

/* edit buttons */
.dokuwiki .editBar .editButtons {
    display: inline;
    margin-right: 1em;
}
[dir=rtl] .dokuwiki .editBar .editButtons {
    margin-right: 0;
    margin-left: 1em;
}

/* summary input and minor changes checkbox */
.dokuwiki .editBar .summary {
    display: inline;
}
.dokuwiki .editBar .summary label {
    vertical-align: middle;
    white-space: nowrap;
}
.dokuwiki .editBar .summary label span {
    vertical-align: middle;
}
.dokuwiki .editBar .summary input {
}
/* change background colour if summary is missing */
.dokuwiki .editBar .summary input.missing {
    color: @ini_text;
    background-color: #ffcccc;
}

/* preview
********************************************************************/

.dokuwiki div.preview {
    border: dotted @ini_border;
    border-width: .2em 0;
    padding: 1.4em 0;
    margin-bottom: 1.4em;
}

/* section edit buttons
********************************************************************/

.dokuwiki .section-heading-row {
    display: flex;
    align-items: baseline;
}

.dokuwiki .section-heading-row > .secedit {
    flex-shrink: 0;
    margin-left: .4em;
}

[dir=rtl] .dokuwiki .section-heading-row > .secedit {
    margin-left: 0;
    margin-right: .4em;
}

.dokuwiki .section-heading-row > .secedit form {
    margin: 0;
}

.dokuwiki .section-heading-row > .secedit button {
    border: 0;
    padding: .15em;
    min-width: 1.25em;
    background: transparent;
    color: @ini_icons;
    font-size: 0;
    line-height: 1;
    cursor: pointer;
}

.dokuwiki .section-heading-row > .secedit button::before {
    content: '\270E  edit';
    opacity: 0.75;
    font-style: italic;
    font-size: .95rem;
}

.dokuwiki .section-heading-row > .secedit button:hover,
.dokuwiki .section-heading-row > .secedit button:focus {
    color: @ini_link;
}

/* Sidebar should never show section edit buttons */
.dokuwiki #dokuwiki__aside .secedit {
    display: none;
}