/* ==========================================================================
   Trip Planner — self-hosted icon glyphs
   --------------------------------------------------------------------------
   Replaces the icon-* classes the trip-planner plugin template renders but
   previously relied on a 3rd-party plugin to supply the font + CSS for.

   How it works: each icon is a tiny inline SVG used as a CSS mask on a
   ::before pseudo-element. background-color: currentColor means the glyph
   always matches whatever colour rule already applies to it (link colour,
   hover state, etc.) with zero extra HTTP requests and no @font-face.

   A few icons (trash, eye, envelope) use fill-rule="evenodd" with
   overlapping subpaths so the inner detail (ridge lines, pupil ring, flap
   crease) reads as a punched-out gap rather than a flat silhouette — the
   same technique generic "solid" icon sets like Font Awesome use.
   ========================================================================== */

.icon[class*="icon-"] {
	position: relative;
	display: inline-block;
	width: 1em;
	height: 1em;
	line-height: 1;
	vertical-align: -0.125em;
}

.icon[class*="icon-"]::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

/* Icons that sit inside a solid coloured circle (Add Another Day button,
   the drag handle) want some breathing room instead of touching the edge. */
.icon.circled::before,
.item-sort .icon::before {
	inset: 22%;
}

/* Re-affirm the circle diameters the plugin CSS already relies on, so this
   stylesheet can safely load in any order relative to it. */
.icon.circled {
	width: 32px;
	height: 32px;
}
.item-sort .icon {
	width: 42px;
	height: 42px;
}

/* -- Save (check) --------------------------------------------------- */
.icon-checked::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.55 17.6 4.4 12.45l1.4-1.4 3.75 3.75L18.2 6.15l1.4 1.4z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.55 17.6 4.4 12.45l1.4-1.4 3.75 3.75L18.2 6.15l1.4 1.4z'/%3E%3C/svg%3E");
}

/* -- Share (share-nodes) ---------------------------------------------- */
.icon-share::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='6' cy='12' r='2.5'/%3E%3Ccircle cx='18' cy='6' r='2.5'/%3E%3Ccircle cx='18' cy='18' r='2.5'/%3E%3Cpath d='M8.2 10.8 15.8 7.2M8.2 13.2l7.6 3.6' stroke='black' stroke-width='2' fill='none'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='6' cy='12' r='2.5'/%3E%3Ccircle cx='18' cy='6' r='2.5'/%3E%3Ccircle cx='18' cy='18' r='2.5'/%3E%3Cpath d='M8.2 10.8 15.8 7.2M8.2 13.2l7.6 3.6' stroke='black' stroke-width='2' fill='none'/%3E%3C/svg%3E");
}

/* -- Print ------------------------------------------------------------- */
.icon-printer::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12a1 1 0 0 1 1 1v4h-2V5H7v3H5V4a1 1 0 0 1 1-1zM4 9h16a1 1 0 0 1 1 1v6a2 2 0 0 1-2 2h-2v3a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1v-3H5a2 2 0 0 1-2-2v-6a1 1 0 0 1 1-1zm4 9h8v-4H8v4zm9-5a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12a1 1 0 0 1 1 1v4h-2V5H7v3H5V4a1 1 0 0 1 1-1zM4 9h16a1 1 0 0 1 1 1v6a2 2 0 0 1-2 2h-2v3a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1v-3H5a2 2 0 0 1-2-2v-6a1 1 0 0 1 1-1zm4 9h8v-4H8v4zm9-5a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3C/svg%3E");
}

/* -- Add Another Day (plus) ------------------------------------------- */
.icon-plus::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 4h2v7h7v2h-7v7h-2v-7H4v-2h7z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 4h2v7h7v2h-7v7h-2v-7H4v-2h7z'/%3E%3C/svg%3E");
}

/* -- Delete item (trash can, with lid/handle/ridge lines) -------------- */
.icon-trash::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M9 2h6a1 1 0 0 1 1 1v1H8V3a1 1 0 0 1 1-1zM4 5h16a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1zM5 9h14l-1.2 11.1A2 2 0 0 1 15.8 22H8.2a2 2 0 0 1-2-1.9zM9.5 11h1v8h-1zM11.5 11h1v8h-1zM13.5 11h1v8h-1z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M9 2h6a1 1 0 0 1 1 1v1H8V3a1 1 0 0 1 1-1zM4 5h16a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1zM5 9h14l-1.2 11.1A2 2 0 0 1 15.8 22H8.2a2 2 0 0 1-2-1.9zM9.5 11h1v8h-1zM11.5 11h1v8h-1zM13.5 11h1v8h-1z'/%3E%3C/svg%3E");
}

/* -- View (eye, with white-of-eye ring + solid pupil) ------------------ */
.icon-eye2::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 5c-5 0-9.27 3.11-11 7 1.73 3.89 5.95 7 11 7s9.27-3.11 11-7c-1.73-3.89-5.95-7-11-7zM12 7.2c-3.5 0-6.7 1.9-8.4 4.8 1.7 2.9 4.9 4.8 8.4 4.8s6.7-1.9 8.4-4.8c-1.7-2.9-4.9-4.8-8.4-4.8zM12 9.4a2.6 2.6 0 1 1 0 5.2 2.6 2.6 0 0 1 0-5.2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 5c-5 0-9.27 3.11-11 7 1.73 3.89 5.95 7 11 7s9.27-3.11 11-7c-1.73-3.89-5.95-7-11-7zM12 7.2c-3.5 0-6.7 1.9-8.4 4.8 1.7 2.9 4.9 4.8 8.4 4.8s6.7-1.9 8.4-4.8c-1.7-2.9-4.9-4.8-8.4-4.8zM12 9.4a2.6 2.6 0 1 1 0 5.2 2.6 2.6 0 0 1 0-5.2z'/%3E%3C/svg%3E");
}

/* -- Sort handle (plus sign with arrow ends) ----------------------------- */
.icon-move::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 9h4V6h3l-5-5-5 5h3v3zm-1 1H6V7l-5 5 5 5v-3h3v-4zm14 2l-5-5v3h-3v4h3v3zm-9 3h-4v3H7l5 5 5-5h-3z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 9h4V6h3l-5-5-5 5h3v3zm-1 1H6V7l-5 5 5 5v-3h3v-4zm14 2l-5-5v3h-3v4h3v3zm-9 3h-4v3H7l5 5 5-5h-3z'/%3E%3C/svg%3E");
}

/* -- Delete day (circle with X) ---------------------------------------- */
.icon-cross-circle::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm3.54 12.12-1.42 1.42L12 13.41l-2.12 2.13-1.42-1.42L10.59 12 8.46 9.88l1.42-1.42L12 10.59l2.12-2.13 1.42 1.42L13.41 12l2.13 2.12z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm3.54 12.12-1.42 1.42L12 13.41l-2.12 2.13-1.42-1.42L10.59 12 8.46 9.88l1.42-1.42L12 10.59l2.12-2.13 1.42 1.42L13.41 12l2.13 2.12z'/%3E%3C/svg%3E");
}

/* -- Modal close (plain X) ---------------------------------------------- */
.icon-cross::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.3 5.71 12 12l6.3 6.29-1.41 1.42L10.59 13.4 4.3 19.71l-1.41-1.42L9.18 12 2.89 5.71 4.3 4.29l6.29 6.3 6.3-6.3z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.3 5.71 12 12l6.3 6.29-1.41 1.42L10.59 13.4 4.3 19.71l-1.41-1.42L9.18 12 2.89 5.71 4.3 4.29l6.29 6.3 6.3-6.3z'/%3E%3C/svg%3E");
}

/* -- Phone (contact detail) --------------------------------------------- */
.icon-phone-handset::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.2 6.6 6.6l2.2-2.2c.3-.3.7-.4 1.1-.2 1.2.4 2.5.6 3.8.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.5 21 3 13.5 3 4c0-.6.4-1 1-1h3.4c.6 0 1 .4 1 1 0 1.3.2 2.6.6 3.8.1.4 0 .8-.2 1.1z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.4 2.8 3.8 5.2 6.6 6.6l2.2-2.2c.3-.3.7-.4 1.1-.2 1.2.4 2.5.6 3.8.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.5 21 3 13.5 3 4c0-.6.4-1 1-1h3.4c.6 0 1 .4 1 1 0 1.3.2 2.6.6 3.8.1.4 0 .8-.2 1.1z'/%3E%3C/svg%3E");
}

/* -- Email (contact detail, with flap crease cutout) -------------------- */
.icon-envelope1::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M3 5h18v14H3zM5 7l7 6 7-6v1.6l-7 6.2-7-6.2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M3 5h18v14H3zM5 7l7 6 7-6v1.6l-7 6.2-7-6.2z'/%3E%3C/svg%3E");
}

/* -- Website / external link (contact detail) --------------------------- */
.icon-exit-up::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 3h8v8h-2V6.41l-9.3 9.3-1.41-1.42L17.59 5H13zM5 5h6v2H7v10h10v-4h2v5a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 3h8v8h-2V6.41l-9.3 9.3-1.41-1.42L17.59 5H13zM5 5h6v2H7v10h10v-4h2v5a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}
