/* =========================================================
   Svensk-Franska stiftelsen – Gravity Forms & GravityKit styles
   Colors: Ollie theme palette only (--wp--preset--color--<slug>).
   GravityView views use the Vantage theme; only our own features and token overrides are styled here.

   Ollie slot                              Value     Used for
   Brand             primary               #80785B   buttons, accents
   Brand Accent      primary-accent        #ECE9E0   pale gold: highlighted rows and boxes
   Brand Alt         primary-alt           #9F956F   light gold: borders, decoration
   Brand Alt Accent  primary-alt-accent    #605A44   dark gold: button hover, gold text and links
   Contrast          main                  #211F17   text
   Contrast Accent   main-accent           #E2E0D8   warm light grey
   Base              base                  #FFFFFF   boxes, text on buttons, top of the gradient
   Base Accent       secondary             #323024   muted text (or #5E5A4A for a visible step)
   Tint              tertiary              #F6F6F3   paper: bottom of the gradient
   Border Base       border-light                    thin borders
   Border Contrast   border-dark           #4E4A3A   strong borders

   Gradient (Ollie's slug kept, colors replaced). Buttons use flat colors.
   pink    site background  linear-gradient(180deg, #FFFFFF 0%, #F6F6F3 100%)
   ========================================================= */


/* =========================================================
   0. VARIABLES
   ========================================================= */
:root {
	--sfs-btn-bg:       var(--wp--preset--color--primary);
	--sfs-btn-bg-hover: var(--wp--preset--color--primary-alt-accent);
	--sfs-btn-text:     var(--wp--preset--color--base);
	--sfs-btn-radius:   4px;
	--sfs-btn-padding:  .75em 1.75em;

	/* Ghost buttons: text and icon color */
	--sfs-ghost-text:   var(--wp--preset--color--primary-alt-accent);

	--sfs-danger: #900;
}


/* =========================================================
   1. BUTTONS – SOLID
   Non-block buttons following Ollie's button design.
   ========================================================= */
.sfs-button,
#gf-archive-button,
#gf-trash-rejected-button,
.gv-back-link a,
.gpasc-delete-draft-button,
.button.gv-add-note-submit {
	padding: var(--sfs-btn-padding);
	border: 0;
	border-radius: var(--sfs-btn-radius);
	background: var(--sfs-btn-bg);
	color: var(--sfs-btn-text) !important;
	text-decoration: none !important;
	cursor: pointer;
}
.sfs-button:hover,
#gf-archive-button:hover,
#gf-trash-rejected-button:hover,
.gv-back-link a:hover,
.button.gv-add-note-submit:hover {
	background: var(--sfs-btn-bg-hover);
	color: var(--sfs-btn-text);
}


/* =========================================================
   2. BUTTONS – GHOST
   ========================================================= */

/* Generic ghost button, and GravityView search "Återställ" (clear) */
.sfs-button-ghost,
.gv-themed .gv-widget-search.gv-widget-search .gv-search-box-submit .gv-search-clear {
	padding: var(--sfs-btn-padding);
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: var(--sfs-btn-radius);
	background: transparent;
	color: var(--sfs-ghost-text) !important;
	text-decoration: none !important;
	cursor: pointer;
	transition: border-color .2s;
}
.sfs-button-ghost:hover,
.gv-themed .gv-widget-search.gv-widget-search .gv-search-box-submit .gv-search-clear:hover {
	border-color: var(--wp--preset--color--border-dark);
	background: transparent;
	color: var(--sfs-ghost-text) !important;
}

/* GravityEdit: inline edit toggle */
.inline-edit-enable {
	padding: var(--sfs-btn-padding);
	border: 0;
	border-radius: var(--sfs-btn-radius);
	text-decoration: none !important;
	transition: .2s;
}
.gv-inline-edit-off .inline-edit-enable {
	border: 1px solid var(--wp--preset--color--border-light);
	color: var(--sfs-ghost-text) !important;
}
.gv-inline-edit-off .inline-edit-enable:hover {
	border-color: var(--wp--preset--color--border-dark);
}
.gv-inline-edit-on .inline-edit-enable {
	border: 1px dashed var(--wp--preset--color--border-dark);
	color: var(--sfs-danger) !important;
	font-style: italic !important;
}
.gv-inline-edit-off .inline-edit-enable:hover,
.gv-inline-edit-on .inline-edit-enable:hover {
	opacity: .9;
}

/* "Visa" link inside the multiple entries table (eye icon) */
td.btn-visa {
	padding-right: 0 !important;
	padding-left: 0 !important;
}
td.btn-visa a {
	display: inline-flex;
	padding: 2px 4px;
	border: 1px solid var(--wp--preset--color--border-light);
	border-radius: 20px;
	margin-left: 6px;
	color: var(--sfs-ghost-text) !important;
	text-decoration: none !important;
	transition: border-color .2s;
}
td.btn-visa a:hover {
	border-color: var(--wp--preset--color--border-dark);
}
td.btn-visa a::before {
	content: '';
	display: inline-block;
	position: relative;
	top: 2px;
	width: 20px;
	height: 20px;
	margin-right: 6px;
	background-color: var(--wp--preset--color--primary); /* icon color */
	-webkit-mask: url('images/eye-icon.svg') no-repeat center / contain;
	mask: url('images/eye-icon.svg') no-repeat center / contain;
}


/* =========================================================
   3. GRAVITYVIEW – VANTAGE TOKENS
   ========================================================= */
.gv-themed.gv-theme-vantage {
	/* Surfaces and borders */
	--gv-color-surface-alt:   var(--wp--preset--color--primary-accent); /* row hover */
	--gv-color-border:        var(--wp--preset--color--border-dark);
	--gv-widget-border-color: var(--wp--preset--color--border-light);
	--gv-color-row-divider:   var(--wp--preset--color--main-accent);
	--gv-entry-border-color:  var(--wp--preset--color--primary);
	--gv-border-width-2:      4px;

	/* Table header */
	--gv-color-header-bg:     var(--wp--preset--color--primary-accent);
	--gv-color-header-text:   var(--wp--preset--color--base);

	/* Accent (Vantage's blue: links, ghost buttons, focus) */
	--gv-color-primary:       var(--wp--preset--color--primary);

	/* Buttons */
	--gv-button-bg:           var(--sfs-btn-bg);
	--gv-button-color:        var(--sfs-btn-text);
	--gv-button-bg-hover:     var(--sfs-btn-bg-hover);

	/* Table headers and single entry labels */
	--gv-field-label-font-size:      var(--wp--preset--font-size--x-small);
	--gv-field-label-font-weight:    400;
	--gv-field-label-letter-spacing: 0;
	--gv-field-label-color:          var(--wp--preset--color--main);
}

/* Search button hover: Vantage's hover doesn't read --gv-button-bg-hover */
.gv-themed .gv-widget-search.gv-widget-search .gv-search-box-submit .gv-search-button:hover {
	background-color: var(--sfs-btn-bg-hover);
}


/* =========================================================
   4. GRAVITYVIEW – TABLES
   ========================================================= */

/* Editable cells: gold tint layered over the row background, so the hover color still shows.
   !important: keeps the tint if a background shorthand resets background-image. */
.gv-themed table.gv-table-view td:has(.editable),          /* multiple entries table */
.gv-themed table.gv-table-view-content td:has(.editable) { /* single entry */
	--sfs-editable-tint: color-mix(in srgb, var(--wp--preset--color--primary) 6%, transparent);
	background-image: linear-gradient(var(--sfs-editable-tint), var(--sfs-editable-tint)) !important;
}

/* Approval status field: disapproved in red with an X before the word */
.gv-approval-disapproved {
	color: var(--sfs-danger);
}
.gv-approval-disapproved::before {
	content: '';
	display: inline-block;
	position: relative;
	top: 6px;
	width: 24px;
	height: 24px;
	margin-right: 4px;
	background-color: var(--sfs-danger); /* icon color */
	-webkit-mask: url('images/close-icon.svg') no-repeat center / contain;
	mask: url('images/close-icon.svg') no-repeat center / contain;
}

/* Confirmed identity (blue tick) and final report (gold R) */
div.confirmed-id {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

span.conf-tick,
span.conf-tick-single,
span.report-tick {
	display: inline-block;
	flex-shrink: 0;
	background-repeat: no-repeat;
}
span.conf-tick,
span.conf-tick-single {
	background-image: url('images/verified-badge-64.webp');
	background-position: right;
}
span.conf-tick {
	width: 17px;
	height: 17px;
	margin-left: 8px;
	background-size: 17px 17px;
}
span.conf-tick-single {
	width: 22px;
	height: 22px;
	margin-left: 10px;
	background-size: 22px 22px;
}
span.report-tick {
	width: 17px;
	height: 17px;
	margin-right: 5px;
	background-image: url('images/sfs-report-r.png');
	background-position: left center;
	background-size: 17px 17px;
}


/* =========================================================
   5. GRAVITYVIEW – SINGLE ENTRY
   ========================================================= */

/* Edit link with pen icon (form 1 and 4) */
.gv-table-view-content #gv-field-1-edit_link a,
.gv-table-view-content #gv-field-4-edit_link a {
	display: inline-flex;
	padding: 4px 12px;
	border-radius: 26px;
	background: var(--sfs-btn-bg);
	color: var(--sfs-btn-text);
	text-decoration: none !important;
}
.gv-table-view-content #gv-field-1-edit_link a:hover,
.gv-table-view-content #gv-field-4-edit_link a:hover {
	background: var(--sfs-btn-bg-hover);
}
.gv-table-view-content #gv-field-1-edit_link a::before,
.gv-table-view-content #gv-field-4-edit_link a::before {
	content: '';
	display: inline-block;
	position: relative;
	top: 2px;
	width: 20px;
	height: 20px;
	margin-right: 6px;
	background-color: var(--sfs-btn-text); /* icon color */
	-webkit-mask: url('images/pen-icon.svg') no-repeat center / contain;
	mask: url('images/pen-icon.svg') no-repeat center / contain;
}

/* "Hantera": GravityView edit button */
tr.btn-hantera td a {
	display: inline-flex;
	align-items: center;
	padding: 8px 12px !important;
	border-radius: var(--sfs-btn-radius);
	background: var(--sfs-btn-bg) !important;
	color: var(--sfs-btn-text) !important;
	font-size: 1rem;
	font-weight: 400;
	text-decoration: none !important;
}
tr.btn-hantera td a:hover {
	background: var(--sfs-btn-bg-hover) !important;
}


/* =========================================================
   6. GRAVITYVIEW – NOTES
   ========================================================= */

/* Empty notes box (form 1 only) */
tr#gv-field-1-notes.gv-field-1-notes td div.gv-notes.gv-no-notes.gv-show-notes {
	padding: 1em;
	background: var(--wp--preset--color--tertiary);
}

/* Notes list */
.gv-show-notes.gv-has-notes form.gv-notes-list div table {
	border-collapse: separate;
	border-spacing: 0 10px; /* vertical space between notes */
}
.gv-notes-list div table tbody tr.gv-note th.check-column,
.gv-notes-list div table thead tr th {
	width: 30px !important;
	background: var(--wp--preset--color--tertiary);
	text-align: left;
}
.gv-show-notes.gv-has-notes form.gv-notes-list div table tbody tr.gv-note td.entry-detail-note {
	border: 1px solid var(--wp--preset--color--border-light);
}

/* Notes list header: select-all toggle and delete button */
.gv-notes-list thead tr th label:has(.gv-notes-toggle) {
	display: inline !important;
}
.gv-notes-list thead tr th label .gv-notes-toggle {
	margin-left: 12px;
}
thead tr th button.button.button-small.gv-notes-delete {
	margin-left: 10px;
	border-color: var(--wp--preset--color--base);
	background-color: var(--sfs-danger);
	color: var(--wp--preset--color--base);
}

/* Avatar: circle until an image loads */
.gv-note-avatar {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50px;
	height: 50px;
	overflow: hidden;
	border: .5px solid var(--wp--preset--color--border-dark);
	border-radius: 50%;
	background: var(--wp--preset--color--tertiary);
}
.gv-note-avatar:has(img) {
	background: none;
}
.gv-note-avatar img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Add note */
.gv-notes .gv-note-add textarea:focus {
	border-color: var(--wp--preset--color--border-dark);
}
.gv-notes .gv-note-email-to {
	margin-bottom: 10px;
}
.gv-themed .gv-note-add .gv-note-to-container {
	background-color: var(--wp--preset--color--tertiary) !important;
}


/* =========================================================
   7. GRAVITYVIEW – EDIT ENTRY (from previous version – not reviewed)
   ========================================================= */
h2.gv-edit-entry-title {
	display: none;
}

/* Delete button: faded until hover */
.btn-danger.gv-button-delete {
	position: relative;
	left: 50px;
	float: none !important;
	border: 1px solid var(--sfs-danger) !important;
	background: var(--sfs-danger) !important;
	color: #fff !important;
	opacity: .25 !important;
}
.btn-danger.gv-button-delete:hover {
	opacity: 1 !important;
}

/* Upload preview controls */
.gv-edit-entry-wrapper .ginput_preview_control {
	bottom: .21rem;
	left: .5rem;
}


/* =========================================================
   8. GRAVITYVIEW – COMMENTS (view 2540, DIY layout – not reviewed)
   ========================================================= */
.gv-container-2540 .gv-diy-view {
	margin-bottom: 10px;
	padding: 15px;
	border: 1px solid var(--wp--preset--color--border-light);
	background: var(--wp--preset--color--base);
}
p.skapad_av {
	margin-bottom: 5px !important;
	font-size: 16px;
	font-weight: 600;
}
.radera_kommentar a {
	font-size: 16px;
	text-align: right;
	text-decoration: none;
}
.radera_kommentar a:hover {
	color: var(--sfs-danger) !important;
}


/* =========================================================
   9. GRAVITY FORMS – GENERAL (not reviewed)
   ========================================================= */

/* Hide "* indicates required fields" */
.gform_required_legend {
	display: none;
}

/* Inputs: 16px prevents iOS zoom on focus */
body .gform_wrapper .gform_body input,
body .gform_wrapper .gform_body select,
body .gform_wrapper .gform_body textarea {
	font-size: 16px !important;
}

.ginput_container input {
	color: var(--wp--preset--color--main) !important;
}

/* Read-only fields */
.gform_wrapper input[readonly] {
	border-color: var(--gf-ctrl-border-color-disabled);
	background-color: var(--gf-ctrl-bg-color-disabled);
	color: var(--gf-ctrl-color-disabled);
	opacity: .5;
	cursor: not-allowed;
}

/* Validation messages */
.gfield_description.gfield_validation_message {
	margin-top: 5px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 5px;
	border-radius: 4px;
	background: var(--sfs-danger);
	color: #fff !important;
	font-size: .8em;
}

/* File uploads: hide size/type rules text */
.gfield_description.gform_fileupload_rules {
	display: none !important;
}

/* File uploads: previews in a row */
.gform-theme--framework .gfield:where(.gfield--type-fileupload, .gfield--input-type-fileupload) .ginput_preview {
	flex-direction: row;
	padding-top: .8em;
}


/* =========================================================
   10. GRAVITY FORMS – FORM-SPECIFIC (not reviewed)
   ========================================================= */

/* Forms 1 & 4: frame the upload fields */
div#field_1_19,
div#field_4_23 {
	padding: 10px;
	border: 1px solid var(--wp--preset--color--primary-alt);
	border-radius: 4px;
	background-color: var(--wp--preset--color--base);
}

/* Forms 1 & 4: hide multi-file validation messages */
ul#gform_multifile_messages_1_58.validation_message--hidden-on-empty.gform-ul-reset li.gfield_description.gfield_validation_message,
ul#gform_multifile_messages_4_49.validation_message--hidden-on-empty.gform-ul-reset li.gfield_description.gfield_validation_message {
	display: none;
}

/* Form 2: field 56 description */
div#gfield_description_2_56.gfield_description {
	font-size: 1em;
}

/* Form 4 (researchers): hide max amount instruction */
#gfield_instruction_4_20 {
	display: none;
}

/* Form 4 (researchers): linked page steps (GP Multi-Page Navigation) */
.gf_step.gpmpn-step-linked {
	padding-right: 8px;
}
.gf_step.gpmpn-step-linked:hover {
	border-radius: 30px;
	background-color: var(--wp--preset--color--primary-accent);
}


/* =========================================================
   11. GP ADVANCED SAVE & CONTINUE (drafts, [gpasc_drafts] – not tested)
   Delete draft button is styled as a solid button in section 1.
   ========================================================= */
#gpasc-auto-load-notice {
	padding: 20px;
	border: 1px solid var(--sfs-danger);
	border-radius: 6px;
	background-color: var(--wp--preset--color--base);
}

.gpasc-drafts {
	padding: 22px;
	background-color: var(--wp--preset--color--base);
}

.gpasc-draft-link a {
	text-decoration: none !important;
}

.gpasc-delete-draft-button {
	position: relative;
	top: 4px;
	left: 6px;
}
.gpasc-delete-draft-button:hover {
	color: var(--sfs-danger) !important;
}


/* =========================================================
   12. WORDPRESS
   ========================================================= */

/* Admin email confirmation screen that appears now and then */
.admin-email-confirm-form {
	background-color: transparent !important;
}


/* =========================================================
   13. POSSIBLY UNUSED – verify, then remove
   ========================================================= */

/* Only matches forms using the "Gravity Forms 2.5" theme (.gravity-theme).
   Orbital forms (.gform-theme--orbital) are not affected. */
.gform_wrapper.gravity-theme .gfield_checkbox label,
.gform_wrapper.gravity-theme .gfield_radio label {
	font-size: 16px !important;
}

/* =========================================================
   14. Slide-in underline for the navigation menu - class prim-menu-slide-in-underscore must be added to each nav block.
   ========================================================= */

.wp-block-navigation .wp-block-navigation-item__label {
	position: relative;
	display: inline-block;
}
.wp-block-navigation .wp-block-navigation-item__label::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -2px; /* distance below the text; adjust to taste */
	width: 100%;
	height: 2px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.2s ease-in-out;
	pointer-events: none;
}

/* Show on hover, keyboard focus, and for the current page */
.wp-block-navigation .wp-block-navigation-item__content:hover .wp-block-navigation-item__label::after,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible .wp-block-navigation-item__label::after,
.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"] .wp-block-navigation-item__label::after {
	transform: scaleX(1);
}
/* Remove WordPress's default hover underline so the lines don't double up */
.wp-block-navigation .wp-block-navigation-item__content[aria-current="page"],
.wp-block-navigation .wp-block-navigation-item__content:hover {
	text-decoration: none !important;
}
/* Turn off the animation for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
	.wp-block-navigation .wp-block-navigation-item__label::after {
		transition: none;
	}
}