@import url('https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400..700;1,400..700&display=swap');

:root {
	--wbicc-color-primary: #006994; 
	--wbicc-color-secondary: #5c6bc0; 
}


html, body {
	overflow-x: hidden;
}

/*
 * //////////////////////
 CSS for Menu Doante Button
 * //////////////////////
*/

.wbicc-menu-button {
    padding: 4px 0px !important;
}

.wbicc-menu-button a {
    
    background-color: var(--e-global-color-primary );
    border-radius: 35px;
    color: white !important;
    font-weight: bold !important;
    font-size: 0.8em;
    padding: 0 20px !important;
/*     text-transform: uppercase; */
    min-height: 35px;
}

.wbicc-menu-button a:after {
    border: none !important;
    background: none !important;
}

@media (max-width: 767px) {
    .wbicc-menu-button {
        display: none !important;
    }
}


/*
 * //////////////////////
 *  CSS for Prayer times widget 
 * //////////////////////
 */
 
 

.widget_prayer_time_widget_panel_date {
	font-size: 0.8em;
	font-weight: 500;
	line-height: 1em;
	text-align: end;
	padding: 0 10px 0 10px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.widget_prayer_time_widget_panel_date a {
	font-weight: 500;
}



/* This removes bottom padding for mobile elementor widgets */

.elementor-widget-wp-widget-wbicc_prayer_time_widget {
	margin-bottom: 0 !important;
}

.widget_prayer_time_widget_panel {
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items:center;
	justify-content: center;
	flex: 1;
	margin: 0;
	width: 100%;
}

.widget_prayer_time_widget_panel button {
	line-height: 0.5em;
	overflow: clip;
	text-overflow: clip;
	text-wrap: nowrap;
	padding: 0;
}


.widget_prayer_time_widget_panel td,th, table {
	border: none !important;
	padding: 2px;
	text-align: center;
	color: #212121;
	margin: 0;
	width: 100%;
}

.widget_prayer_time_widget_panel th {
	border: none;
	font-size: 0.9em;
	line-height: 0.1em;
	font-weight: 900 !important;
	font-family: 'Cabin', 'Open Sans', 'Sans-Serif';
	text-transform: uppercase;
	color: #717171;
	width: auto;
	border-bottom-color: transparent !important;
    border-bottom-style: solid !important;
    border-bottom-width: 3px !important;
	padding: 10px 15px 10px 15px;
}

.widget_prayer_time_widget_panel tr>td:second-child {
	color: #717171;
	background-color: white;
}

/* This is the first column, so Start/Jamat */
.widget_prayer_time_widget_panel tr td:first-child {
	color: #717171;
	background-color: white;
	font-family: 'Cabin';
	font-size: 0.9em;
	width: 50px;
	text-align: end;
	padding-right: 6px;
	padding-left: 4px;
}

.widget_prayer_time_widget_panel td {
	border: none;
	font-size: 1em;
	line-height: 1.3em;
	font-weight: 700;
	width: auto;
	background-color: white !important; /* important to override elemtor theme */
}

.widget_prayer_time_widget_panel table {
	width: 100%;
	margin-bottom: 0;
}

.widget_prayer_time_widget_panel {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	justify-content: space-between;
	width: 100%;
	padding: 0 2px 4px 0;
	border-bottom: 1px solid #eaeaea;;
}

.widget_prayer_time_widget_panel_date {
	color: #717171;
	text-align: center;
}

.widget_prayer_time_widget_panel .widget_prayer_time_widget_panel_key {
	text-transform: uppercase;
}

.widget_prayer_time_widget_panel .widget_prayer_time_link {
	font-size: 0.9em !important; /* prevent elementor override */
	font-weight: bold;
	color: var(--wbicc-color-primary);
	text-decoration: underline;
	text-align: start;
	padding: 0 6px 0px 4px;
}

/*
 * Set the next prayer time as a rounded box, helps stand out
 */

/* Rounded top for heading row */
.widget_prayer_time_widget_panel th.next_prayer {
	text-transform: uppercase;
/* 	border-bottom-color: #006994 !important;
    border-bottom-style: solid !important;
    border-bottom-width: 3px !important; */
	background-color: var(--wbicc-color-primary) !important;
    color: white;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}
.widget_prayer_time_widget_panel tr:first-child td.next_prayer {
	background-color: var(--wbicc-color-primary)  !important;
    color: white;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}
.widget_prayer_time_widget_panel td.next_prayer {
	background-color: var(--wbicc-color-primary)  !important;
    color: white;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

/* 
 * Set the Full Timetable button and jumah
 */

.widget_prayer_time_date_section {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.widget_prayer_time_date_section a {
	text-align: start;
	text-decoration: underline;
}

@media(max-width: 499px) {
	.widget_prayer_time_date_section {
		font-size: 14px;
		justify-content: center;
	}
	
	.widget_prayer_time_widget_panel {
		flex-direction: column;
		align-items: center;
	}
	
	.widget_prayer_time_widget_panel .widget_prayer_time_link, .widget_prayer_time_link:hover {
		font-size: 15px !important; /* prevent elementor override */
        text-decoration: underline;
		padding: 0 4px 4px 8px;
		text-align: center;
	}
}

@media(max-width: 767px) {
	.widget_prayer_time_date_section {
		font-size: 14px;
		justify-content: center;
	}
}

@media(max-width: 767px) {
	
	.widget_prayer_time_date_section {
		font-size: 14px;
		justify-content: center;
	}

	
	.widget_prayer_time_widget_panel td:first-child {
		font-size: 0.8em;
	}
	
	.widget_prayer_time_widget_panel th {
		font-size: 0.8em;
		padding: 10px 0px 8px 0px;
	}
	
	.widget_prayer_time_widget_panel td {
		font-size: 0.9em;
	}
	.widget_prayer_time_widget_panel table {
		width: 100%;
	}
	/* This is the first column, so Start/Jamat */
	.widget_prayer_time_widget_panel tr td:first-child {
		font-size: 0.8em;
	}

}



/*
 * ////////////////////////////////////////////////////////////////
 * Prayer time month widget
 * ////////////////////////////////////////////////////////////////
 */

.widget_month_prayer_time_widget_panel {
	justify-content: flex-start;
    width: 100%;
   	overflow: scroll;
	padding: 0;
	display: flex;
	flex-direction: row;
	flex: 1;
	gap: 6px;
	margin: 0;
	
}

.widget_month_prayer_time_widget_panel button {
	line-height: 0.5em;
	overflow: clip;
	text-overflow: clip;
	text-wrap: nowrap;
	padding: 0;
}

.widget_month_prayer_time_widget_panel table:first-child {
	min-width: 360px;
}

.widget_month_prayer_time_widget_panel table:last-child {
	min-width: 280px;
}

	
.widget_month_prayer_time_widget_panel td,th, table {
	border: none;
	padding: 2px;
	text-align: center;
	color: #212121;
	margin: 0;
}

.widget_month_prayer_time_widget_panel th {
	border: none;
	font-size: 0.9em;
	line-height: 0.1em;
	font-weight: 900 !important;
	font-family: 'Cabin', 'Open Sans', 'Sans-Serif';
	text-transform: uppercase;
	color: #717171;
	width: auto;
	border-bottom-color: transparent !important;
    border-bottom-style: solid !important;
    border-bottom-width: 3px !important;
	padding: 8px 6px;
	color: white;
}

.widget_month_prayer_time_widget_panel thead {
	color: white;
	padding: 2px 0;
}


.widget_month_prayer_time_widget_panel tr>td:first-child {
	border-bottom-left-radius: 8px;
	border-top-left-radius: 8px;
}



.widget_month_prayer_time_widget_panel tr>td:last-child {
	border-bottom-right-radius: 8px;
	border-top-right-radius: 8px;
}


.widget_month_prayer_time_widget_panel td {
	border: none;
	border-top: 2px solid white;
    border-bottom: 2px solid white;
    border-left: none;
    border-right: none;
	padding: 2px;
	text-align: center;
	color: #212121;
	margin: 0;
}

.widget_month_prayer_time_widget_panel table tbody>tr.prayer_time_friday>td {
	color: #b71d1c;
	font-weight: bold;
}



.widget_month_prayer_time_widget_panel th.prayer_time_jamah {
	background-color: var(--wbicc-color-secondary);
	color: white;
}


.widget_month_prayer_time_widget_panel th.prayer_time_start {
	background-color: var(--wbicc-color-primary);
	color: white;
}


.widget_month_prayer_time_widget_panel thead>tr:first-child>th {
	padding: 20px 0;
}

.widget_month_prayer_time_widget_panel thead>tr:nth-child(2)>th {
	padding: 12px 0;
}

.widget_month_prayer_time_widget_panel table tbody>tr:nth-child(odd)>td.prayer_time_jamah {
	background-color: #c5cae9;
}
.widget_month_prayer_time_widget_panel table tbody>tr:nth-child(even)>td.prayer_time_jamah {
	background-color: #e8eaf6;
}
.widget_month_prayer_time_widget_panel table tbody>tr:nth-child(odd)>td.prayer_time_start {
	background-color: #bbdefb;
}
.widget_month_prayer_time_widget_panel table tbody>tr:nth-child(even)>td.prayer_time_start {
	background-color: #e3f2fd;
}

.widget_month_prayer_time_widget_panel th.prayer_time_gap,td.prayer_time_gap {
	background-color: white !important;
	color: white;
	width: 10px;
	max-width: 10px;
}




.widget_prayer_time_date_section {
	display: flex;
	flex-direction: column;
}


/*
 * ////////////////////////////////////////////////////////////////
 * ////////////////////////////////////////////////////////////////
 * Misc changes to support plugins themes etc
 * ////////////////////////////////////////////////////////////////
 * */

@media (min-width:545px) {
	article.post > div > div.entry-content{ 
	padding: 0 20px;
	max-width:1240px;
	margin-left:auto;
	margin-right:auto;
}
}

article.post > div > div.entry-content { 
	padding: 0 20px;
}
/*
 * ////////////////////// 
 * //////////////////////
 */


.border-bl-lg {
	border-bottom-left-radius: 8px;
}

.border-br-lg {
	border-bottom-right-radius: 8px;
}

.border-b-lg {
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}

.border-tl-lg {
	border-top-left-radius: 8px;
}

.border-tr-lg {
	border-top-right-radius: 8px;
}

.border-t-lg{
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}