/**
 * Rakmyat Divider Widget Styles
 *
 * A separator line widget with text or icon element support
 *
 * @package Rakmyat Core
 * @version 1.0.0
 */

/* ========================================
   Base Wrapper
   ======================================== */

.rmt-divider-wrapper {
	display: block;
	width: 100%;
	line-height: 1;
}

/* ========================================
   Divider Element
   ======================================== */

.rmt-divider-element {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 100%;
	position: relative;
}

/* ========================================
   Divider Line (Base)
   ======================================== */

.rmt-divider-line {
	display: block;
	flex: 1 1 auto;
	border-top-style: solid;
	border-top-width: 1px;
	border-color: #000000;
	min-width: 0;
}

/* ========================================
   Divider Styles
   ======================================== */

/* Solid */
.rmt-divider-style-solid .rmt-divider-line {
	border-top-style: solid;
}

/* Dashed */
.rmt-divider-style-dashed .rmt-divider-line {
	border-top-style: dashed;
}

/* Dotted */
.rmt-divider-style-dotted .rmt-divider-line {
	border-top-style: dotted;
}

/* Double */
.rmt-divider-style-double .rmt-divider-line {
	border-top-style: double;
	border-top-width: 3px; /* Double border needs minimum 3px */
}

/* ========================================
   Divider with Element (Text/Icon)
   ======================================== */

.rmt-divider-has-element {
	display: flex;
	align-items: center;
	justify-content: center;
}

.rmt-divider-has-element .rmt-divider-line-before {
	margin-inline-end: 0; /* RTL-aware spacing */
}

.rmt-divider-has-element .rmt-divider-line-after {
	margin-inline-start: 0; /* RTL-aware spacing */
}

/* ========================================
   Divider Content (Text/Icon Container)
   ======================================== */

.rmt-divider-content {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	white-space: nowrap;
	padding-inline-start: 18px; /* RTL-aware gap */
	padding-inline-end: 18px;   /* RTL-aware gap */
}

/* ========================================
   Text Element
   ======================================== */

.rmt-divider-text {
	display: inline-block;
	color: #000000;
	line-height: 1;
	margin: 0;
	padding: 0;
}

/* ========================================
   Icon Element
   ======================================== */

.rmt-divider-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #000000;
	font-size: 16px;
	line-height: 1;
	transition: transform 0.3s ease;
}

.rmt-divider-icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
	display: block;
}

.rmt-divider-icon i {
	font-size: inherit;
	line-height: inherit;
}

/* ========================================
   Rich Content Element
   ======================================== */

.rmt-divider-content-html {
	display: inline-block;
	line-height: 1.5;
}

.rmt-divider-content-html * {
	margin: 0;
}

.rmt-divider-content-html p {
	margin-bottom: 0;
}

.rmt-divider-content-html h1,
.rmt-divider-content-html h2,
.rmt-divider-content-html h3,
.rmt-divider-content-html h4,
.rmt-divider-content-html h5,
.rmt-divider-content-html h6 {
	margin-bottom: 0;
	line-height: 1.2;
}

/* ========================================
   Responsive Adjustments
   ======================================== */

@media (max-width: 767px) {
	.rmt-divider-content {
		/* Reduce gap on mobile for better fit */
		padding-inline-start: 12px;
		padding-inline-end: 12px;
	}

	.rmt-divider-text {
		/* Ensure text doesn't break on mobile */
		font-size: 14px;
	}
}

/* ========================================
   Accessibility
   ======================================== */

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
	.rmt-divider-icon {
		transition: none !important;
	}
}

/* ========================================
   Elementor Editor Styles
   ======================================== */

.elementor-editor-active .rmt-divider-wrapper {
	/* Add slight padding in editor for better visibility */
	padding: 2px 0;
}
