/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/


/* Hide scrollbar for IE, Edge and Firefox */
.nosp {
  overflow-x: hidden;
} 

.min-vh-54 {
	min-height: 54vh !important;
}

.card-border {
	border:1vh solid #C6C09C;
}

.swiper-navs{
	left:300px !important;
	right:auto !important;
}

.back-about{
	background-color: #cda336;
}

.w-text {
	color: #ffffff !important;

}

.cocon-next-arabic {
	font-family: 'cocon-next-arabic' !important;
}

.sky-bold {
	font-family: 'sky-bold' !important;
}

.M-Zero{
	margin: 0px;
}


.TopP-Zero{
	padding-top: 10px;
}

/* Admin list tables: keep the table within its container width instead of
   letting long cell content (emails, numbers) push it wider than the screen. */
.table-responsive .table {
	table-layout: fixed;
	width: 100%;
}

.table-responsive .table th,
.table-responsive .table td {
	white-space: normal;
	padding: 0.4rem 0.5rem;
	vertical-align: middle;
}

/* Only body cells risk holding one long unbroken token (an email, a URL) that
   needs force-breaking; header labels are short authored text and must only
   wrap at word boundaries, never mid-word. */
.table-responsive .table td {
	overflow-wrap: break-word;
	word-wrap: break-word;
}

.table-responsive .table th {
	overflow-wrap: normal;
	word-wrap: normal;
}

/* Column-size hints for admin list tables, weighted by the role each column
   plays rather than split evenly: the row's main title/name column gets the
   largest share, category/date/image/author get a modest share, toggles and
   order numbers stay small, and actions stays just wide enough for one
   stacked button. Widths use fr units, which distribute 100% of the table's
   width proportionally to these weights (unlike %, they don't need to add
   up to 100 by hand for every table's specific column set). */
.table-responsive .table th.col-title,
.table-responsive .table td.col-title {
	width: 25fr;
}

.table-responsive .table th.col-secondary,
.table-responsive .table td.col-secondary {
	width: 15fr;
}

.table-responsive .table th.col-category,
.table-responsive .table td.col-category {
	width: 12fr;
}

.table-responsive .table th.col-date,
.table-responsive .table td.col-date {
	width: 12fr;
}

.table-responsive .table th.col-image,
.table-responsive .table td.col-image {
	width: 10fr;
}

.table-responsive .table th.col-author,
.table-responsive .table td.col-author {
	width: 10fr;
}

.table-responsive .table th.col-toggle,
.table-responsive .table td.col-toggle,
.table-responsive .table th.col-narrow,
.table-responsive .table td.col-narrow {
	width: 7fr;
}

.table-responsive .table th.col-actions,
.table-responsive .table td.col-actions {
	width: 4fr;
}

/* Row-action buttons (edit/details/delete): keep them on one line, but shrink
   their padding/gap so three icons still fit in a narrow actions column. */
.table-responsive .table td .btn-group {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	gap: 2px;
}

.table-responsive .table td .btn-group .button {
	margin: 0;
	padding: 4px 5px;
}

/* Tables with an email column: table-layout:fixed can't let one column grow
   past its share, so switch this table back to the browser's normal content-
   based algorithm. The email column (col-flex) is left unsized so it grows
   to fit a long address; every other column keeps a plain pixel width as a
   strong hint, so the extra room the email column claims is taken from them. */
.table-responsive .table.table-auto-layout {
	table-layout: auto;
}

.table-responsive .table.table-auto-layout th.col-flex,
.table-responsive .table.table-auto-layout td.col-flex {
	width: auto;
	white-space: nowrap;
}

.table-responsive .table.table-auto-layout th.col-title,
.table-responsive .table.table-auto-layout td.col-title {
	width: 220px;
}

.table-responsive .table.table-auto-layout th.col-secondary,
.table-responsive .table.table-auto-layout td.col-secondary {
	width: 160px;
}

.table-responsive .table.table-auto-layout th.col-narrow,
.table-responsive .table.table-auto-layout td.col-narrow,
.table-responsive .table.table-auto-layout th.col-toggle,
.table-responsive .table.table-auto-layout td.col-toggle {
	width: 70px;
}

.table-responsive .table.table-auto-layout th.col-actions,
.table-responsive .table.table-auto-layout td.col-actions {
	width: 100px;
}