#image-annotate-edit-form {
 border: 1px solid #000000;
 background: #ffffee none repeat scroll 0 0;
 }
.image-actions {
    background:  #000;
    padding:5px;
    border-bottom-right-radius:5px;
    -moz-border-radius-bottomright: 5px; 
    -webkit-border-bottom-right-radius: 5px;
   
   position:absolute;
   top:0px;
   clear:both;
  
}
.image-actions a {
   color:#eee;
}
.annotate-view-wrapper {
	display:block;
	clear:none;
	float:left;
	margin: 0px 10px 10px 0px;
}
.annotate-view-preview-links {
	float:right;
	padding-top:5px;
}

.hover_img a { position:relative; }
.hover_img a span { position:absolute; display:none; z-index:999999;
	top: 25px;
}

tr.currentloc {
	color: black; border-bottom: 1px solid #333 !important;
}

.currentloc td {
	padding-bottom: 10px !important;border-bottom: 1px solid silver !important;
}
#whereaboutnotes th {
	color: black;
}

#WhereaboutsSection table.headertable tbody tr td {
	padding-left: 0;
}

#whereaboutnotes {
}


tr.currentloc td {
	padding-top: 8px !important;
}

.hover_img a:hover span { display:block;
	border: 1px solid silver;
	height: 250px;
}

.hover_img a:hover span img{
	position: relative;
	padding: 0;
	margin: 0;
}


th.note,td.note {
	height: 20px; margin: 0;
	white-space: normal !important;
}

table.headertable {
	width: 100%;
	border-spacing:0 !important;
	
}

.currentlocheader {
	font: 11px ralewaybold,helvetica,sans-serif;
	position: relative;
	top: 5px;
	padding-top: 5px !important;
}

#whereaboutnotes {
	margin: 8px 0 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
	border-top: 1px solid silver;
}

textarea#image-annotate-text {
	border-color: silver;
	height: 23px;
	position: relative;
	top: 2px;
}

#whereaboutnotes table{
	border-spacing:0;
	width: 100%;
}
#whereaboutnotes table tbody tr td {
	margin-top: 0;
	margin-right: 0;
	margin-left: 0;
	padding-right: 0;
	padding-bottom: 8px;
	padding-left: 0;
}
.spacerrow {
	height: 10px;
}



/* Sortable history columns (2026-07-23).
   Kept in the plugin's own stylesheet rather than the site theme so the plugin stays
   self-contained for the other sites - these are control affordances, not site styling. */
/* Sortable headers live in the ADD FORM on the edit screen and in the history table on the view
   page, so both must be styled - scoping this to .whereabouts_history alone meant no arrows at all
   on the edit screen. */
.whereabouts_addform th.wa_sortable,
.whereabouts_history th.wa_sortable { cursor: pointer; user-select: none; white-space: nowrap; }
/* A header longer than its column (PERCENTAGE at mid widths) is clipped with "...", never drawn over the next one. */
.whereabouts_addform th, .whereabouts_history th { overflow: hidden; text-overflow: ellipsis; }
.whereabouts_addform th.wa_sortable:hover,
.whereabouts_history th.wa_sortable:hover { text-decoration: underline; }

/* Neutral indicator so a column reads as sortable before it is clicked... */
.whereabouts_addform th.wa_sortable .wa_sortarrow:after,
.whereabouts_history th.wa_sortable .wa_sortarrow:after { content: "\2195"; opacity: 0.35; }
/* ...replaced by the actual direction once it is. */
.whereabouts_addform th.wa_asc  .wa_sortarrow:after,
.whereabouts_history th.wa_asc  .wa_sortarrow:after { content: "\25B2"; opacity: 1; }
.whereabouts_addform th.wa_desc .wa_sortarrow:after,
.whereabouts_history th.wa_desc .wa_sortarrow:after { content: "\25BC"; opacity: 1; }

.whereabouts_addform th.wa_sortable .wa_sortarrow,
.whereabouts_history th.wa_sortable .wa_sortarrow { margin-left: 4px; }

/* Even spacing, and alignment between the add form and the history table below it (2026-07-23).
   They are two separate <table> elements, so equal columns only happen with a fixed layout and
   matching widths. Percentages must total 100 and stay in step with the column order in
   hooks/edit.php and whereabouts_render_history(). */
.whereabouts_addform,
.whereabouts_history { table-layout: fixed; width: 100%; border-collapse: collapse; }

.whereabouts_addform th, .whereabouts_addform td,
.whereabouts_history th, .whereabouts_history td { padding: 4px 6px !important; vertical-align: top; }

.whereabouts_addform th:nth-child(1), .whereabouts_addform td:nth-child(1),
.whereabouts_history th:nth-child(1), .whereabouts_history td:nth-child(1) { width: 11%; }  /* Date */
.whereabouts_addform th:nth-child(2), .whereabouts_addform td:nth-child(2),
.whereabouts_history th:nth-child(2), .whereabouts_history td:nth-child(2) { width: 20%; }  /* Location */
.whereabouts_addform th:nth-child(3), .whereabouts_addform td:nth-child(3),
.whereabouts_history th:nth-child(3), .whereabouts_history td:nth-child(3) { width: 10%; }  /* Type */
.whereabouts_addform th:nth-child(4), .whereabouts_addform td:nth-child(4),
.whereabouts_history th:nth-child(4), .whereabouts_history td:nth-child(4) { width:  9%; }  /* Price */
.whereabouts_addform th:nth-child(5), .whereabouts_addform td:nth-child(5),
.whereabouts_history th:nth-child(5), .whereabouts_history td:nth-child(5) { width:  5%; }  /* Cur. - short symbols (€), so just wide enough for one plus the arrow */
.whereabouts_addform th:nth-child(6), .whereabouts_addform td:nth-child(6),
.whereabouts_history th:nth-child(6), .whereabouts_history td:nth-child(6) { width: 12%; }  /* Percentage */
.whereabouts_addform th:nth-child(7), .whereabouts_addform td:nth-child(7),
.whereabouts_history th:nth-child(7), .whereabouts_history td:nth-child(7) { width: 23%; }  /* Note */
.whereabouts_addform th:nth-child(8), .whereabouts_addform td:nth-child(8),
.whereabouts_history th:nth-child(8), .whereabouts_history td:nth-child(8) { width: 10%; }  /* Action */

/* Inputs fill their cell, so the gaps between fields are the cell padding and nothing else. */
.whereabouts_addform input[type="text"],
.whereabouts_addform select,
.whereabouts_addform textarea { width: 100%; box-sizing: border-box; margin: 0; }

/* Per-row action icons (edit / delete, and save / cancel while a row is being edited). */
.whereabouts_history a.wa_icon { display: inline-block; padding: 2px 4px; text-decoration: none; font-size: 1.1em; }
.whereabouts_history a.wa_icon:hover { opacity: 0.6; }
.whereabouts_history tr.wa_editing td { overflow: visible; }

/* Add button in the add form. Core gives every <button> min-width:100px, which overflows the
   narrow Action column, so shrink it back to its content. */
.whereabouts_addform button.wa_addbutton { min-width: 0; min-height: 0; padding: 3px 10px; margin: 0; white-space: nowrap; }

/* Edit page preview (2026-10-22, reworked same day per SS).
   RS 10.7 gives the edit preview its own right-hand grid column (.BasicsBoxRight, core 250px), which
   wasted the full height of the form. On wide screens the grid is dropped: the form runs full width
   and the preview becomes a small thumbnail in the top-right corner, under the "View all results"
   nav and above the right end of the whereabouts table. Its file info and links (core's, or
   resource_copymaster's replacement) are moved by hooks/edit.php into .wa_preview_links, a menu that
   opens under the thumbnail on hover/focus. hooks/edit.php also sets the exact top offset and pushes
   the next section down if the thumbnail would overlap it.
   At <=850px core already stacks the preview under the form (slim-style.css); there it is left
   alone and the links stay visible. Selectors use .BasicsBox.BasicsBoxEdit to outrank core. */
@media (min-width: 851px) {
    .BasicsBox.BasicsBoxEdit { display: block; position: relative; }
    .BasicsBox.BasicsBoxEdit .BasicsBoxLeft { padding-right: 0; }
    .BasicsBox.BasicsBoxEdit .QuestionSubmit.QuestionSticky,
    .BasicsBox.BasicsBoxEdit .RecordHeader { width: 100%; }

    .BasicsBox.BasicsBoxEdit .BasicsBoxRight { position: absolute; top: 70px; right: 0; margin: 0; z-index: 5; }
    .BasicsBox.BasicsBoxEdit .Question.QuestionStickyRight { width: auto; height: auto; padding: 0; margin: 0;
        border: none; box-shadow: none; background: none; }
    .BasicsBox.BasicsBoxEdit .QuestionStickyRight > .clearerleft { display: none; }
    .BasicsBox.BasicsBoxEdit .FloatingPreviewContainer { position: relative; top: 0; margin: 0; text-align: right; }  /* core top:15px was for sticky */
    .BasicsBox.BasicsBoxEdit .FloatingPreviewContainer > img,
    .BasicsBox.BasicsBoxEdit #preview, .BasicsBox.BasicsBoxEdit #wmpreview {   /* ids: slim-style caps #preview at 200px */
        display: block; width: auto; height: auto; max-width: 220px; max-height: 140px; margin: 0 0 0 auto !important; cursor: pointer; }
    .BasicsBox.BasicsBoxEdit #wmpreview { display: none; }  /* core toggles it inline with the watermark link */

    /* Hover menu: flush under the thumbnail (no gap) so the pointer can travel into it. */
    .BasicsBox.BasicsBoxEdit .wa_preview_links { display: none; position: absolute; top: 100%; right: 0; min-width: 220px;
        padding: 8px 12px; text-align: left; white-space: nowrap; line-height: 1.6;
        background: #fff; color: #333; border: 1px solid #ccc; box-shadow: 0 4px 12px rgba(0,0,0,0.2); }
    .BasicsBox.BasicsBoxEdit .BasicsBoxRight:hover .wa_preview_links,
    .BasicsBox.BasicsBoxEdit .BasicsBoxRight:focus-within .wa_preview_links { display: block; }
    .BasicsBox.BasicsBoxEdit .BasicsBoxRight:hover #preview { outline: 2px solid #1f7ac2; }
}
.wa_preview_links:empty { display: none !important; }

#WhereaboutsSection { overflow-x: auto; }

/* Narrow layout (2026-10-22): below ~760px of available width the 8-column table is unreadable,
   so each record becomes a stacked card of "LABEL value" lines (labels come from the data-label
   attributes in hooks/edit.php and whereabouts_render_history()), and the header row becomes a
   wrapping row of sort buttons. A container query, not a media query, so it reacts to the space
   the table actually gets (edit form or view-page panel), not just the screen width. */
#WhereaboutsSection, #Whereabouts { container: whereabouts / inline-size; }

/* Text nudge (2026-10-25, per Olaf): on the edit screen the history text sat flush with the add-form
   BOXES above it (both cells pad 6px). Core global.css gives every text input / select / textarea
   6px inner padding + a 1px border, so the text inside a box starts 7px in: 6 + 7 = 13px lines the
   entries up with that text. (A first try at +2px was too small to see.) Entries only - the add form,
   a row open in the inline editor, and the Action icons keep 6px. Wide layout only; the stacked card
   layout below has no columns to line up. */
@container whereabouts (min-width: 761px) {
    #WhereaboutsSection .whereabouts_history tr:not(.wa_editing) td:not(:last-child) { padding-left: 13px !important; }
}

@container whereabouts (max-width: 760px) {
    .whereabouts_addform, .whereabouts_history,
    .whereabouts_addform tbody, .whereabouts_history thead, .whereabouts_history tbody { display: block; width: 100%; }

    .whereabouts_addform tr:first-child,
    .whereabouts_history thead tr { display: flex; flex-wrap: wrap; gap: 2px 14px; }
    .whereabouts_addform th, .whereabouts_history th { width: auto !important; padding: 2px 0 !important; }
    .whereabouts_addform th.actions, .whereabouts_history th.actions, .whereabouts_history th:empty { display: none; }

    .whereabouts_addform tr + tr,
    .whereabouts_history tbody tr { display: block; padding: 6px 0; border-bottom: 1px solid silver; }

    .whereabouts_addform td, .whereabouts_history td,
    .whereabouts_history tr.currentloc td { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); column-gap: 8px;
        align-items: center; width: auto !important; padding: 3px 0 !important; border: none !important; }
    .whereabouts_addform td[data-label]::before,
    .whereabouts_history td[data-label]::before { content: attr(data-label); font-size: 0.8em; font-weight: bold;
        text-transform: uppercase; opacity: 0.6; }
    /* Action / Add cells carry no label: plain block, buttons left-aligned under the fields. */
    .whereabouts_addform td:not([data-label]), .whereabouts_history td:not([data-label]),
    .whereabouts_history tr.currentloc td:not([data-label]) { display: block; }
    .whereabouts_history td:empty { display: none !important; }

    /* Current record: accent bar instead of the wide-table bottom rule. */
    .whereabouts_history tr.currentloc { border-left: 3px solid #1f7ac2; padding-left: 8px; }
}

/* List touches (2026-10-22, per SS): text 2px smaller than the page's 15px (headers 14 -> 12,
   data 15 -> 13; card labels are 0.8em of the cell so they follow), current record bold
   throughout, older records collapsible (toggle in hooks/all.php). Inputs keep their size. */
.whereabouts_addform th, .whereabouts_history th { font-size: 12px; }
.whereabouts_history td { font-size: 13px; }
.whereabouts_history tr.currentloc td, .whereabouts_history tr.currentloc td a { font-weight: bold; }
.whereabouts_history.wa_collapsed tr.wa_older { display: none !important; }
a.wa_older_toggle { display: inline-block; margin: 6px 0 2px; font-size: 12px; text-decoration: none; cursor: pointer; }
a.wa_older_toggle:hover span { text-decoration: underline; }