/* ============================================================
   Custom CSS — Vakfotografie Westerduin (pasfotolatenmaken.com)
   Ingevuld op het selector-template van SimplyBook (klassiek thema)
   Kleuren: oranje #f47a20 · papier #f8f6f3 · zwart #090909
            lijn #e4dcd3 · zacht oranje #fff3e8 · subtekst #555
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700;800&display=swap');

/* ---------- basis ---------- */
body {
	font-family: 'Poppins', -apple-system, 'Segoe UI', sans-serif !important;
	background: #f8f6f3 !important;
	color: #090909 !important;
}
a { color: #f47a20 !important; }
h1, h2, h3, h4 {
	font-family: 'Poppins', sans-serif !important;
	color: #090909 !important;
	font-weight: 800 !important;
}

/* ---------- dienstenlijst ---------- */
#events h3 {
	color: #090909 !important;
	font-weight: 800 !important;
	font-size: 18px !important;
	letter-spacing: -.01em;
}
#events p.duration, #events div.duration {
	color: #f47a20 !important;
	font-weight: 700 !important;
	font-size: 13px !important;
}
#events p.description, #events div.description {
	color: #555 !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
}
#events .selectedEvent {
	background: #fff3e8 !important;
	border: 2px solid #f47a20 !important;
	border-radius: 16px !important;
}

/* ---------- knoppen: oranje pillen zoals op de site ---------- */
#events input.reserve_time_btn,
#eventForm #save_button {
	background: #f47a20 !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 12px 26px !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 700 !important;
	font-size: 15px !important;
	cursor: pointer !important;
	box-shadow: none !important;
	text-shadow: none !important;
	transition: background .12s ease, transform .12s ease;
}
#events input.reserve_time_btn:hover,
#eventForm #save_button:hover {
	background: #d9660f !important;
	transform: translateY(-1px);
}
#events input.select_another_btn {
	background: #fff !important;
	color: #090909 !important;
	border: 1px solid #e4dcd3 !important;
	border-radius: 999px !important;
	padding: 11px 22px !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	box-shadow: none !important;
	text-shadow: none !important;
}
#events input.select_another_btn:hover {
	border-color: #f47a20 !important;
	color: #f47a20 !important;
}

/* ---------- koppen bij datum- en tijdkeuze ---------- */
#eventForm #start_date-block-container h3,
#eventForm #timeline-container h3 {
	color: #090909 !important;
	font-weight: 800 !important;
	font-size: 17px !important;
}

/* ---------- kalender (jQuery UI) ---------- */
div.ui-widget-content {
	background: #fff !important;
	border: 1px solid #e4dcd3 !important;
	border-radius: 16px !important;
	color: #090909 !important;
	font-family: 'Poppins', sans-serif !important;
}
div.ui-widget-header {
	background: #090909 !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 12px !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 700 !important;
}
div.ui-widget-header a { color: #fff !important; }

/* dagen in de kalender */
.ui-widget-content .ui-state-default {
	background: #fff !important;
	border: 1px solid #e4dcd3 !important;
	color: #090909 !important;
	border-radius: 8px !important;
	text-align: center !important;
}
.ui-widget-content .ui-state-hover {
	background: #fff3e8 !important;
	border-color: #f47a20 !important;
	color: #090909 !important;
}
.ui-widget-content .ui-state-active,
.ui-widget-content .ui-state-highlight {
	background: #f47a20 !important;
	border-color: #f47a20 !important;
	color: #fff !important;
	font-weight: 700 !important;
}

/* ---------- tijdsloten ---------- */
#timeline-container table.timeline {
	border-collapse: separate !important;
	border-spacing: 4px !important;
	background: transparent !important;
}
.timeline td.not_worked_time {
	background: #f8f6f3 !important;
	color: #bbb !important;
	border: 1px solid #eee7de !important;
	border-radius: 8px !important;
}
.timeline td.free_time {
	background: #fff !important;
	color: #090909 !important;
	border: 1px solid #e4dcd3 !important;
	border-radius: 8px !important;
	font-weight: 600 !important;
	cursor: pointer !important;
}
.timeline td.free_time:hover {
	background: #fff3e8 !important;
	border-color: #f47a20 !important;
}
.timeline td.selected_time {
	background: #f47a20 !important;
	color: #fff !important;
	border: 1px solid #f47a20 !important;
	border-radius: 8px !important;
	font-weight: 700 !important;
}
.timeline td.reserved_time {
	background: #f1ede7 !important;
	color: #999 !important;
	border: 1px solid #e4dcd3 !important;
	border-radius: 8px !important;
	text-decoration: line-through;
}

/* ---------- laadindicator ---------- */
div#loading {
	background-color: #f8f6f3 !important;
	color: #f47a20 !important;
	border-radius: 16px !important;
}

/* ---------- formulierlabels en -velden ---------- */
#start_date-block-container .zend_form dt,
#start_date-block-container .zend_form dt b,
#start_date-block-container .zend_form dd label {
	color: #090909 !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 600 !important;
	font-size: 14px !important;
}
input[type="text"], input[type="email"], input[type="tel"],
input[type="password"], select, textarea {
	background: #fff !important;
	border: 1px solid #e4dcd3 !important;
	border-radius: 12px !important;
	color: #090909 !important;
	padding: 10px 14px !important;
	font-family: 'Poppins', sans-serif !important;
}
input:focus, select:focus, textarea:focus {
	border-color: #f47a20 !important;
	outline: none !important;
	box-shadow: 0 0 0 3px #fff3e8 !important;
}