/* Freeze-specific overrides, loaded after the full prod CSS stack. */

/* Masthead search submit must be EDGE blue (square button like prod). */
.masthead #sb-search-submit,
.masthead .sb-search-submit { background: #004FA3 !important; }
.masthead .sb-icon-search { background: transparent !important; }

/* The legacy header inline style shifts the nav -45px, which on this build
   collides with the logo (hides "Home"). Neutralize the shift. */
.navbar .container .nav-collapse { left: 65px !important; }

/* Login/Register: center the heading + form actions (prod look). */
[class*="user"] .module .page-heading { text-align: center; }
.form-actions.center-text, .module .form-actions { text-align: center; }

/* Header search: the legacy inline style scales the input 1.4x, making the
   placeholder oversized vs prod. Bring it back to normal size. */
.masthead #sb-search-input { transform: none !important; font-size: 14px !important; top: 0 !important; }
.masthead #sb-search-input::placeholder { font-size: 14px !important; }

/* ============================================================================
   Resource page layout — 2.11's markup (full-width module + two floated columns)
   under the 2.7 grid. Without help the columns ride UP beside the module and the
   card's overflow:hidden clips them. Fix: full-width module on top, columns below.
   ============================================================================ */

/* style.css only unsets .row.wrapper.card overflow for logged-in resource pages;
   un-clip it so the metadata table + Resources list are visible. */
.row.wrapper.card { overflow: visible !important; }

/* The resource module: a full-width block on top (display:block is forced on the
   wrapper by resource_read.html). Native 2.7 CSS then floats primary(right) +
   secondary(left) below it, side by side — exactly like prod. We only neutralize
   the stray left-shift / forced height the 2.7 CSS would otherwise apply. */
.row.wrapper.card > .module-resource {
  display: block !important; float: none !important; width: 100% !important; clear: both !important;
  margin: 0 !important; position: static !important;
  left: auto !important; right: auto !important; transform: none !important;
  max-width: 100% !important; min-height: 0 !important; height: auto !important;
}
/* prod gives the metadata module-content 20px padding; style.css's
   `.primary.span9 .module .module-content { padding:0 }` was killing it. */
.resources .primary.span9 .module .module-content { padding: 20px !important; }
.module-resource .module-content { overflow: visible !important; margin-left: 0 !important; }
.module-resource .resource-view,
.module-resource .data-viewer-info,
.module-resource .prose { min-height: 0 !important; height: auto !important; }

/* Below the module: Resources (secondary, left) + metadata (primary, right) side
   by side like prod (the BS4 EDGE CSS leaves them block-stacked otherwise).
   Scoped to the resource page via the module sibling combinator. */
.module-resource ~ .secondary.span3 { float: left !important; width: 24% !important; margin: 0 !important; clear: left !important; }
.module-resource ~ .primary.span9 { float: right !important; width: 74% !important; margin: 0 !important; }

/* Resource list (sidebar): prod gives the non-active items a white background
   (our .row.wrapper.card has no white bg since BS4 .card{bg:#fff} is .bootstrap-4
   scoped). Keep the active item dark (#4A4A4A) like prod. */
.resources .secondary .nav-simple > li > a { background: #ffffff !important; }
.resources .secondary .nav-simple > li.active > a { background: #4A4A4A !important; }

/* Format icons (.format-label) + ckan icons use a CSS sprite. The 2.7 main.css
   references /base/images/sprite-*.png, but 2.11 core ships DIFFERENT sprites at
   that path (different layout), so the 2.7 background-position offsets land on
   blank → gray boxes. Point them at our mirrored 2.7 sprites in /base27/images/. */
.format-label { background-image: url("/base27/images/sprite-resource-icons.png") !important; }
.ckan-icon { background-image: url("/base27/images/sprite-ckan-icons.png") !important; }

/* Dataset sidebar (secondary aside) is white on prod (our .row.wrapper.card has no
   white bg since BS4 .card{bg:#fff} is .bootstrap-4 scoped). */
.dataset .secondary { background: #ffffff !important; }

/* Pagination: 2.11 emits Bootstrap-5 markup (.pagination > .page-item > .page-link)
   which the 2.7 core CSS doesn't style, so it collapses to a vertical list. Lay it
   out horizontally as a standard pager. */
.pagination { display: flex !important; flex-wrap: wrap; justify-content: center; margin: 20px 0; padding-left: 0; list-style: none; }
.pagination .page-item { display: block; }
.pagination .page-item .page-link {
  display: block; padding: 4px 12px; line-height: 20px; text-decoration: none;
  background-color: #fff; border: 1px solid #ddd; border-left-width: 0; color: #004FA3;
}
.pagination .page-item:first-child .page-link { border-left-width: 1px; border-radius: 3px 0 0 3px; }
.pagination .page-item:last-child .page-link { border-radius: 0 3px 3px 0; }
.pagination .page-item.active .page-link { background-color: #004FA3; border-color: #004FA3; color: #fff; }
.pagination .page-item.disabled .page-link { color: #999; background-color: #fafafa; }

/* 2.11 uses the Bootstrap-5 class `list-unstyled`, but the 2.7 core CSS only knows
   the old `.unstyled` — so lists like <ul class="dataset-list list-unstyled"> keep
   the default 25px left margin and shove the cards right (uneven L/R padding).
   Teach it the BS5 class. Scoped to .list-unstyled so prose/bulleted lists keep
   their indent (unlike a global ul,ol reset). */
.list-unstyled { margin-left: 0 !important; list-style: none; }

/* Embed modal: 2.11 uses BS5 modal markup (.modal-dialog/.modal-content) the 2.7
   CSS doesn't frame. Style it as a centered dialog (shown via the JS shim). */
.modal.resource-view-embed { display: none; position: fixed; top: 50%; left: 50%;
  transform: translate(-50%, -50%); z-index: 1050; width: 90%; max-width: 560px; }
.modal.resource-view-embed .modal-content { background: #fff; border: 1px solid #ddd;
  border-radius: 6px; box-shadow: 0 3px 12px rgba(0,0,0,.4); }
.modal.resource-view-embed .modal-header { padding: 12px 15px; border-bottom: 1px solid #eee;
  position: relative; display: flex; align-items: center; justify-content: space-between; }
.modal.resource-view-embed .modal-header h3 { margin: 0; font-size: 16px; }
.modal.resource-view-embed .modal-body { padding: 15px; }
.modal.resource-view-embed textarea[name=code] { width: 100%; }
.modal-backdrop { position: fixed; inset: 0; background: #000; opacity: .5; z-index: 1040; }

/* Download T&Cs popup (dynamicModalFlare): the prod markup used BS4/5 grid classes
   the 2.7 CSS can't render, so it showed only a backdrop and trapped the page.
   Render it as a clean centered dialog (shown/dismissed by the rewritten JS). */
.modal.dl-conditions { display: none; position: fixed; top: 50%; left: 50%;
  transform: translate(-50%, -50%); z-index: 100050; width: 94%; max-width: 720px; }
.modal.dl-conditions .modal-content { position: relative; background: #fff; border: 1px solid #ddd;
  border-radius: 6px; box-shadow: 0 3px 16px rgba(0,0,0,.45); }
.modal.dl-conditions .btn-close { position: absolute; top: 8px; right: 14px; background: none;
  border: 0; font-size: 28px; line-height: 1; cursor: pointer; color: #888; z-index: 2; }
.modal.dl-conditions .modal-body { padding: 24px; }
/* prod markup: 2-column (.col-md-5 image / .col-md-7 text) — the grid is
   .bootstrap-4-scoped so render it explicitly here. */
.modal.dl-conditions .row { display: block; margin: 0; }
.modal.dl-conditions .col-md-5 { display: none; }              /* logo column removed */
.modal.dl-conditions .col-md-7 { max-width: 100%; text-align: center; }
.modal.dl-conditions h5 { margin: 0 0 2px; font-size: 25px; }
.modal.dl-conditions strong { display: block; font-size: 20px; margin-bottom: 12px; }
.modal.dl-conditions .modal-body p { margin: 0; line-height: 1.5; }
.modal.dl-conditions .modal-footer { padding: 14px 24px; border-top: 1px solid #eee; text-align: right; }

/* Force the shim modals fully visible — the 2.7 core CSS's `.modal` / `.modal.fade`
   set opacity:0 + BS3 negative-margin positioning, which left only the backdrop
   showing (black screen, no dialog). These win with !important when JS shows them. */
.modal.dl-conditions, .modal.resource-view-embed {
  position: fixed !important; top: 50% !important; left: 50% !important;
  right: auto !important; bottom: auto !important; margin: 0 !important;
  transform: translate(-50%, -50%) !important; opacity: 1 !important;
  z-index: 100050 !important; max-height: 90vh; overflow: auto;
}
.modal-backdrop { position: fixed !important; inset: 0 !important;
  background: #000 !important; opacity: .5 !important; z-index: 100040 !important; }

/* DataTables view (XLS preview): toolbar buttons sat too close to the Search box —
   just add spacing below them. */
.dataTables_wrapper .dt-buttons { margin-bottom: 10px; margin-top: 15px; }

/* ============================================================================
   Bulk-edit datasets table — org/group "Manage → Datasets" tab (bulk_process).
   2.11 renders a `.table-bulk-edit` table (checkbox column + dataset column, a
   grey action header) that the 2.7 theme doesn't structure, so it showed as
   stray floating checkboxes + text. Replicate vanilla CKAN's table styling
   (values from its core main.css), scoped to .table-bulk-edit so no other table
   is touched. The row-hover "Edit" link works via CSS :hover (its JS is suppressed).
   ============================================================================ */
.table-bulk-edit { width: 100% !important; margin-bottom: 1rem; color: #333;
  border: 1px solid #dee2e6 !important; border-collapse: collapse !important; background: #fff; }
.table-bulk-edit > thead > tr > th,
.table-bulk-edit > tbody > tr > td {
  padding: 0.6rem 0.75rem !important; border: 1px solid #dee2e6 !important; vertical-align: top !important; }
.table-bulk-edit > thead > tr > th { background-color: #f6f6f6 !important; }
.table-bulk-edit > tbody > tr:hover > td { background-color: rgba(0,0,0,0.03); }
.table-bulk-edit .table-actions { text-align: left; }
.table-bulk-edit .table-actions .btn-group { display: inline-block; float: none; margin: 0 10px 0 0; }
.table-bulk-edit td:first-child { width: 40px; text-align: center; }
.table-bulk-edit .dataset-heading { font-size: 16px; margin: 0 0 8px; line-height: 1.3; }
.table-bulk-edit .dataset-heading a { color: #333; }
.table-bulk-edit .context p { margin-bottom: 0; }
.table-bulk-edit .edit.pull-right { float: right; display: none; }
.table-bulk-edit tr:hover .edit.pull-right { display: block; }

/* User edit/manage form (admin-only "Manage" page): keep all section legends a
   consistent size and give fields breathing room. Scoped to #user-edit-form so
   nothing else is affected. (The broken markdown-editor widget on the About
   field is removed via the edit_user_form.html template override.) */
#user-edit-form fieldset { margin: 0 0 22px; padding: 0; border: 0; }
#user-edit-form legend { font-size: 21px; line-height: 1.4; font-weight: 600; width: 100%;
  display: block; margin: 22px 0 12px; padding-bottom: 6px; border-bottom: 1px solid #eee; }
/* (field spacing, inputs, textareas handled by the unified vanilla-forms block below) */

/* ============================================================================
   FORM FIELDS — adopt vanilla CKAN (Bootstrap-5) form styling on the create/edit
   forms. The frozen 2.7 CSS doesn't style 2.11's BS5 form markup (.form-group,
   .form-control, .form-select, .form-label), which had forced a pile of piecemeal
   margin/height/textarea patches. Replicating vanilla's form rules (values lifted
   from CKAN 2.10 core main.css) fixes spacing, textareas and selects in ONE place.
   Scoped to the edit forms — they carry data-module="basic-form" (dataset, resource,
   group, organization); the user form is added by id — so the masthead search and
   dataset filters, which also use .form-control, stay untouched.
   ============================================================================ */

/* Org/Group create/edit forms sit in an `article.module` (vs the dataset/user forms'
   `section.module`), and only the latter's .module-content gets the 20px padding — so
   org/group headings + fields hug the left edge. Restore 20px on exactly the
   module-content that holds each form (:has keeps it from touching anything else). */
.module-content:has(> #organization-edit-form),
.module-content:has(> #group-edit) { padding: 20px !important; }

/* Field-wrapper spacing + height. THE root cause of every textarea/editor overlap:
   EDGE style.css sets a global `.form-group { height: 50px }`, so any field taller
   than 50px (a textarea or the markdown editor) overflows its box and the next field
   rides up over it. Reset to auto height (and restore bottom margin — style.css also
   forces margin:0 !important, hence !important here). */
form[data-module~="basic-form"] .form-group,
form[data-module~="basic-form"] .control-group,
#user-edit-form .form-group,
#user-edit-form .control-group { height: auto !important; margin-bottom: 24px !important; }

/* Labels. */
form[data-module~="basic-form"] .form-label,
#user-edit-form .form-label { margin-bottom: 0.5rem !important; font-weight: 600; }

/* Text inputs + textareas — vanilla .form-control. */
form[data-module~="basic-form"] .form-control,
#user-edit-form .form-control {
  display: block !important; width: 100% !important; height: auto !important;
  padding: 0.375rem 0.75rem !important; font-size: 0.875rem !important; line-height: 1.5 !important;
  color: #333 !important; background-color: #fff !important; background-clip: padding-box;
  border: 1px solid #ced4da !important; border-radius: 0.25rem !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.075) !important; box-sizing: border-box !important; }

form[data-module~="basic-form"] .form-control:focus,
#user-edit-form .form-control:focus {
  border-color: #90b5c1 !important; outline: 0 !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.075), 0 0 0 0.25rem rgba(32,107,130,0.25) !important; }

/* Textareas: natural, drag-resizable height (fixes crushed-to-1-line + overlap). */
form[data-module~="basic-form"] textarea.form-control,
#user-edit-form textarea.form-control {
  min-height: calc(1.5em + 0.75rem + 2px) !important; height: auto !important; resize: vertical; }

/* Selects — vanilla .form-select (chevron + radius + natural height). */
form[data-module~="basic-form"] select,
#user-edit-form select {
  display: block !important; width: 100% !important; height: auto !important;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem !important; font-size: 0.875rem !important;
  line-height: 1.5 !important; color: #333 !important; background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important; background-position: right 0.75rem center !important;
  background-size: 16px 12px !important; border: 1px solid #ced4da !important;
  border-radius: 0.25rem !important; box-shadow: inset 0 1px 2px rgba(0,0,0,0.075) !important;
  -webkit-appearance: none !important; appearance: none !important; }

/* Hints: small grey help text; hide the floating .info-block (its dropped
   .form-horizontal float layout makes it overlap the next field). */
form[data-module~="basic-form"] .form-text,
#user-edit-form .form-text { margin-top: 0.25rem; font-size: 0.875em; color: #6c757d; }
form[data-module~="basic-form"] .controls .info-block,
#user-edit-form .controls .info-block { display: none !important; }

/* Markdown editor (Description/Notes): the "You can use Markdown" bar as a grey strip
   joined under the textarea (borrowed from vanilla _forms.scss). */
form[data-module~="basic-form"] .controls.editor { height: auto !important; }
.editor textarea { border-radius: 0.25rem 0.25rem 0 0 !important; border-bottom: none !important; }
.editor .editor-info-block {
  display: block !important; float: none !important; position: static !important; clear: both !important;
  width: auto !important; margin: 0 !important; padding: 4px 10px !important;
  background: #ebebeb !important; border: 1px solid #ccc !important; border-top: none !important;
  border-radius: 0 0 0.25rem 0.25rem !important; font-size: 11px !important; color: #282828 !important; }

/* Custom fields (Key/Value): 2-column layout, joined input-group (grey key prefix +
   value input) with heights matched to the vanilla inputs. */
.control-custom .row { display: flex; flex-wrap: wrap; margin: 0 -6px; }
.control-custom .row > [class*="col-md-"] { flex: 0 0 50%; max-width: 50%; padding: 0 6px; box-sizing: border-box; }
.control-custom .input-group { display: flex; align-items: stretch; width: 100%; }
.control-custom .input-group-text {
  display: inline-flex; align-items: center; box-sizing: border-box;
  padding: 0.375rem 0.75rem; margin: 0; font-size: 0.875rem; font-weight: 400; color: #555;
  background: #e9ecef; border: 1px solid #ced4da; border-right: 0;
  border-radius: 0.25rem 0 0 0.25rem; white-space: nowrap; }
.control-custom .input-group .form-control {
  flex: 1 1 auto; width: 1% !important; margin: 0 !important;
  border-radius: 0 0.25rem 0.25rem 0 !important; }

/* ============================================================================
   Resource "Data" (Upload/Link) widget — toggled by the base.html shim (adds
   .is-active to the checked panel), styled like vanilla CKAN: radios hidden; the
   URL box is a normal form-control; the file picker is a shim-injected input-group
   (grey "Choose file" + filename field); Remove is a red pill, top-right.
   ============================================================================ */
/* The widget div is shrink-to-fit (sizes to the Data buttons ~183px), starving the
   URL/file inputs of width — force it full-width so its inputs fill the column. */
.resource-upload-field { display: block !important; width: 100% !important; box-sizing: border-box !important; }
.resource-upload-field > input[type="radio"] { display: none !important; }
.resource-upload-field .select-type { position: relative; display: none !important; }
.resource-upload-field .select-type.is-active { display: block !important; }
.resource-upload-field .select-type .form-group.control-full { margin-bottom: 0 !important; }
.resource-upload-field .select-type .form-label { display: block; margin-bottom: 6px; font-weight: 600; }

/* URL box back in flow (ships opacity:0/absolute); inherits the vanilla .form-control. */
.resource-upload-field .select-type.is-active #field-resource-url {
  opacity: 1 !important; position: static !important; width: 100% !important; box-sizing: border-box !important; }

/* Real file input hidden but functional; the shim injects the visible picker. */
.resource-upload-field #field-resource-upload {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0,0,0,0) !important; border: 0 !important; opacity: 0 !important; }
.resource-upload-field .ff-group { display: flex; align-items: stretch; width: 100%; box-sizing: border-box; }
.resource-upload-field .ff-choose {
  flex: 0 0 auto; padding: 0.375rem 0.75rem; font-size: 0.875rem; line-height: 1.5;
  color: #333; background: #e9ecef; border: 1px solid #ced4da; cursor: pointer;
  border-radius: 0.25rem 0 0 0.25rem; white-space: nowrap; }
.resource-upload-field .ff-choose:hover { background: #dde0e3; }
.resource-upload-field .ff-name {
  flex: 1 1 auto; padding: 0.375rem 0.75rem; font-size: 0.875rem; line-height: 1.5;
  color: #333; background: #fff; border: 1px solid #ced4da; border-left: 0;
  border-radius: 0 0.25rem 0.25rem 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.resource-upload-field .btn-remove-url {
  position: absolute; top: 0; right: 0; margin: 0; padding: 2px 14px !important;
  color: #fff !important; background: #d43f3a !important; border: 1px solid #d43f3a !important;
  border-radius: 100px !important; }