:root {
  /* ── Font ── */
  --dp-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* ── Page Background ── */
  --dp-bg-page:          #F9FAFB;
  --dp-bg-white:         #FFFFFF;

  /* ── Borders ── */
  --dp-border:           #E5E7EB;
  --dp-border-light:     #F3F4F6;

  /* ── Text ── */
  --dp-text-heading:     #111827;
  --dp-text-body:        #4B5563;
  --dp-text-muted:       #9CA3AF;
  --dp-text-label:       #6B7280;

  /* ── Brand / Primary (Orange) ── */
  --dp-primary:          #F97316;
  --dp-primary-hover:    #EA580C;
  --dp-primary-light:    #FFF7ED;
  --dp-primary-muted:    #FFEDD5;
  --dp-primary-text:     #9A3412;
  --dp-primary-fg:       #FFFFFF;

  /* ── Status: Success (Green) ── */
  --dp-success:          #16A34A;
  --dp-success-bg:       #F0FDF4;
  --dp-success-light:    #DCFCE7;
  --dp-success-text:     #166534;

  /* ── Status: Info (Blue) ── */
  --dp-info:             #2563EB;
  --dp-info-hover:       #1D4ED8;
  --dp-info-bg:          #EFF6FF;

  /* ── Status: Purple ── */
  --dp-purple:           #9333EA;
  --dp-purple-bg:        #FAF5FF;

  /* ── Status: Error (Red) ── */
  --dp-error:            #DC2626;
  --dp-error-bg:         #FEF2F2;
  --dp-error-text:       #991B1B;

  /* ── Status: Warning (Amber) ── */
  --dp-warning:          #D97706;
  --dp-warning-bg:       #FFFBEB;
  --dp-warning-text:     #92400E;

  /* ── Spacing (8px scale) ── */
  --dp-space-xs:         4px;
  --dp-space-sm:         8px;
  --dp-space-md:         16px;
  --dp-space-lg:         24px;
  --dp-space-xl:         32px;
  --dp-space-2xl:        48px;

  /* ── Border Radius ── */
  --dp-radius-sm:        4px;
  --dp-radius-md:        6px;
  --dp-radius-lg:        8px;
  --dp-radius-xl:        12px;
  --dp-radius-full:      9999px;

  /* ── Shadows ── */
  --dp-shadow-sm:        0 1px 2px rgba(0, 0, 0, 0.05);
  --dp-shadow-md:        0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  --dp-shadow-lg:        0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);

  /* ── Sidebar ── */
  --dp-sidebar-width:    256px;

  /* ── Transitions ── */
  --dp-transition:       150ms ease;
}

@font-face {
  font-family:"Inter";
  src: url("../fonts/Inter.ttf") ;
  font-style: normal;
  font-display: swap;
}

.font{
  font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Inter', Roboto, sans-serif;
  font-size: 14px !important;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 20px;
  letter-spacing: normal;
  color: black;
}
.content{
  height: 100vh;
  overflow-y: auto;
}
.rounded{
  border-collapse: separate !important;
  border-spacing: 0;
  border: 1px solid lightgrey;
  border-radius: 1rem!important;
}
.font-grey{
  color: #4b5563 !important;
}
.hrtag{
	height:2px;
	margin-top:25px;
	margin-bottom:25px;
}
.view {
	text-align: right;
}

@media ( max-width : 767px) {
	.view {
		text-align: left;
	}
	.mob {
		padding: 0px !important;
	}
}

.it .iti--allow-dropdown {
	width: 100%;
}

.bg-black{
	background-color:black!important;
}
.bg-green{
	background-color:rgb(241, 246, 233);
}
.br-10{
	border-radius:10px;
}
.shadow{
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
.bg-grey{
	background-color: #f6f6f6!important;
}
.bg-lightgrey{
	background-color: lightgrey !important;
}
.bg-white{
	background-color: white !important;
}
.bg-purple{
	background-color: #F5F7FF !important;
}
.bg-lightpurple{
	background-color: #DBE4FF !important;
}
.dp-card {
  background: var(--dp-bg-white);
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius-lg);
  padding: var(--dp-space-lg);
  transition: box-shadow var(--dp-transition);
  margin-bottom: 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.02);
}

.dp-card:hover {
  box-shadow: var(--dp-shadow-lg);
}

.dp-card-lg {
  padding: var(--dp-space-lg);
}

.dp-table-wrapper {
  background: var(--dp-bg-white);
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius-xl);
  /* overflow: hidden; */
}

.dp-table-header-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--dp-space-md);
  border-bottom: 1px solid var(--dp-border);
}

.dp-table {
  width: 100%;
  border-collapse: collapse;
}

.dp-table th {
  font-size: 14px;
  font-weight: 500;
  color: var(--dp-text-heading);
  text-align: left;
  padding: 12px 16px;
  background: transparent;
}

.dp-table td {
  font-size: 14px;
  color: var(--dp-text-body);
  padding: 12px 16px;
  border-bottom: 1px solid var(--dp-border-light);
}

.dp-table td.bold {
  font-weight: 500;
  color: var(--dp-text-heading);
}

.dp-table tr:hover {
  background: var(--dp-bg-page);
  cursor: pointer;
}

.dp-table tr:last-child td {
  border-bottom: none;
}

/* Colored text in table cells */
.dp-text-success { color: var(--dp-success); font-weight: 500; }
.dp-text-info    { color: var(--dp-info);    font-weight: 500; }
.dp-text-primary { color: var(--dp-primary); font-weight: 500; }
.dp-text-error   { color: var(--dp-error);   font-weight: 500; }
.dp-text-muted   { color: var(--dp-text-muted); }

.dp-input {
  height: 40px;
  width: 100%;
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius-md);
  padding: 8px 12px;
  font-family: var(--dp-font-family);
  font-size: 14px;
  color: var(--dp-text-heading);
  background: var(--dp-bg-white);
  transition: border-color var(--dp-transition), box-shadow var(--dp-transition);
}

.dp-input::placeholder {
  color: var(--dp-text-muted);
}

.dp-input:focus {
  outline: none;
  border-color: var(--dp-primary);
  box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.2);
}

/* Search Input Wrapper */
.dp-search-wrapper {
  position: relative;
  max-width: 448px;
  flex: 1;
}

.dp-search-wrapper .dp-input {
  padding-left: 36px;
}

.dp-search-wrapper svg {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--dp-text-muted);
  pointer-events: none;
}

/* Textarea */
.dp-textarea {
  width: 100%;
  min-height: 100px;
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius-md);
  padding: 10px 12px;
  font-family: var(--dp-font-family);
  font-size: 14px;
  color: var(--dp-text-heading);
  background: var(--dp-bg-white);
  resize: vertical;
}

.dp-textarea:focus {
  outline: none;
  border-color: var(--dp-primary);
  box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.2);
}

/* Select */
.dp-select {
  height: 40px;
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius-md);
  padding: 8px 12px;
  font-family: var(--dp-font-family);
  font-size: 14px;
  color: var(--dp-text-heading);
  background: var(--dp-bg-white);
  appearance: none;
  cursor: pointer;
}



.close-butn{
	border-radius: 6px;
	color: white;
	background-color:#5c636a!important;
	font-size: 14px !important;
}

.close-butn:hover{
	color: white;
}
.edit-butn{
	border-radius: 6px;
	color: black;
	background-color:white;
	font-size: 14px !important;
	border: 1px solid grey;
	white-space: nowrap;
}
.edit-butn:hover{
	color: black;
}

.text-warning {
    color: var(--dp-primary) !important;
}

.butn{
	background: #FF5700;
    box-shadow: 0px 4px 10px rgba(244, 140, 37, 0.3), inset 0px 1px 0px rgba(255, 255, 255, 0.3);
    font-size: 1rem !important;
	color: white !important;
	white-space: nowrap;
}

.form-control{
	border: 1px solid lightgrey !important;
}
.no-shadow{
	box-shadow: none!important;
	 border: 1px solid lightgrey;
}
.title-font {
	font-size: 24px;
	font-weight: 600;
	color: #111827;
}
.sub-title-font {
	font-size: 16px;
	font-weight: 400;
	color: #4b5563;
}
.table-head {
	height: 50px;
    vertical-align: middle !important;
}
td {
	height: 60px !important;
    vertical-align: middle !important;
}
.add-btn {
	border: 1px dashed #2563eb;
    color: #2563eb;
    background: transparent;
    border-radius: 8px;
    white-space: nowrap;
}
.add-btn:hover {
	background: #2563eb;
    color: #fff;
}
.form-label {
	font-weight: bold;	
}
.btn-back{
  border-radius:50%!important;
}
.selected-box {
    background: #f1f7ff;                  
    border: 1px solid #cfe2ff;            
    padding: 12px 18px;
    border-radius: 10px;                  
    font-size: 16px;
    font-family: Arial, sans-serif;
    color: #0d47a1;                       
    width: 98%;
    margin: 10px auto;
    box-shadow: 0 0 4px rgba(0,0,0,0.05);
}
.truncate {
    max-width: 250px;   
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.switch-width{
	width: 20%;
}
.table-hover tbody tr:hover {
  background-color: #F6F6F6 !important;
}
.modal-title{
	font-size: 16px!important;
	font-weight: bold!important;
}