/* 4K Ultra HD Screens (1601px and above) */
@media all and (min-width: 769px) {
	.table-background {
		background: var(--addit_white);
		border: 1px solid var(--primary_border);
		border-radius: 14px;
		padding: 24px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		transition: all 0.25s ease;
		box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
	}

}

/* Large Desktop */
@media (max-width: 1600px) {}


/* Large Desktop Screens (1201px – 1600px) */
@media (min-width: 1201px) and (max-width: 1600px) {}

/* Standard Desktop Screens (993px – 1200px) */
@media (min-width: 993px) and (max-width: 1200px) {}

@media (max-width: 975px) and (min-width: 610px) {
	body.toolbar-tray-open.toolbar-vertical.toolbar-fixed {
		margin-left: 0px;
	}

}

/* Small Laptops (769px – 992px) */
@media (min-width: 769px) and (max-width: 992px) {}

/* Tablets (577px – 768px) */
@media (min-width: 577px) and (max-width: 768px) {
	.prescription-admin-form {
		max-width: 720px;
	}

	#prescription-lines-wrapper .form-item .form-checkboxes .form-type-checkbox label {
		font-size: 12px;
	}


	.prescription-lines-table .form-checkboxes .js-form-item {
		width: 23px;
		height: 23px;
	}

	.prescription-lines-table tr .form-item input {
		font-size: 12px;
	}

	#prescription-lines-wrapper td,
	#prescription-lines-wrapper th {
		padding: 6px 6px;
		font-size: 13px;
	}
}

/* Small Mobile Landscape (481px – 576px) */
@media (min-width: 481px) and (max-width: 576px) {}

/* Extra Small Mobile (0px – 480px) */
@media (min-width: 0px) and (max-width: 480px) {}

/* 4K and Large screens */
@media (max-width: 4000px) {}


/* Desktop */
@media (max-width: 1024px) {
	#edit-left-vitals .fieldset-wrapper,
	#prescription-admin-form #edit-left-prescription-options-prescription-format{
		    grid-template-columns: repeat(2, 1fr);
	}
	.column-4 {
		width: 49%;
	}
#doctor-register-or-edit-form #edit-account-row .form-type-email, #doctor-register-or-edit-form #edit-account-row .form-type-textfield{
	width: 45%;
}
#doctor-register-or-edit-form .js-form-item{
	    justify-content: flex-start;
}
.doctor-register-or-edit-form #edit-settings{
	    grid-template-columns: repeat(2, 45%);
}
#doctor-register-or-edit-form #edit-account-row .form-type-password
{
	    width: 45%;
    max-width: 45%;
}
	.dashboard-section.overview,
	.md\:grid {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 15px;
	}

	.col-span-4,
	.col-span-3 {
		grid-column: span 1 !important;
	}

	.page-title {
		font-size: 28px;
	}
	#prescription-admin-form .form-item.js-form-item-left-diagnostic, #prescription-admin-form .form-item.js-form-item-left-chief-complaint, #prescription-admin-form .form-item.js-form-item-left-date-prescribed, #prescription-admin-form .form-item.js-form-item-left-expiry-date{
		width: 100%;
	}
	/* #prescription-admin-form fieldset.prescription-lines-table-wrapper {
		width: min-content;
	} */

	.dashboard-section-tabs {
		grid-template-columns: 1fr;
	}

	#prescription-view {
		padding: 0 16px;
	}

	.invoice-form__wrapper {
		grid-template-columns: 1fr;
	}
	.prescription-left-col{
		width: 50%;
	}
}

@media (max-width: 1023px) {
	.prescription-admin-form {
		max-width: 100%;
		display: block;
	}
	#prescription-lines-wrapper {
		width: 100%;
		padding-left: 0px;
		margin-top: 20px;
	}
}

/* Small Laptop */
@media (max-width: 992px) {
	.column-4 {
		width: 48%;
	}
	#prescription-admin-form .form-item.js-form-item-left-diagnostic, #prescription-admin-form .form-item.js-form-item-left-chief-complaint, #prescription-admin-form .form-item.js-form-item-left-date-prescribed, #prescription-admin-form .form-item.js-form-item-left-expiry-date{
		width: 49%;
	}
	#prescription-lines-wrapper .form-item.prescription-lines-table-wrapper{
		padding-top: 0px;
	}
	#edit-left-vitals .fieldset-wrapper{
		    grid-template-columns: repeat(5, 1fr);
	}
	#prescription-admin-form #edit-left-prescription-options-prescription-format{
		    grid-template-columns: repeat(4, 1fr);
	}

	.prescription-left-col {
		width: 100%;
		padding: 30px 15px 0px;
		border-right: none;
	}

	#prescription-lines-wrapper {
		width: 100%;
	}

	.dashboard-card {
		padding: 8px;
	}

	/* .dashboard-card .p-4{ */
	/* padding:8px !important; */
	/* } */


	.appointment-custom-node-form #edit-wrapper {
		display: flex;
		flex-direction: column-reverse;
	}

	.live-long-login {
		flex-direction: column;
	}

	.live-long-login .login-brand,
	.live-long-login .login-card {
		width: 100%;
	}

	.live-long-login .login-card {
		padding: 40px 24px;
	}

}

@media (max-width: 768px) {

	.lab-report-form .form-wrapper {
		padding: 0px;
	}

	.pharmacy-dashboard .dashboard-grid--3,
	.dashboard-section.overview,
	.dashboard-section-tabs .md\:grid,
	.dashboard-section.top_cards {
		gap: 10px;
	}

	.patient-dashboard .pb-0 {
		padding-bottom: 0px !important;
	}

	.doctor-dashboard .dashboard-section-tabs .pt-0.xxl\:p-6 {
		padding-top: 0px !important;
	}

	.col-span-4,
	.col-span-3 {
		width: 100%;
		margin-bottom: 15px;
	}

	.p-4,
	.dashboard-section-tabs .medication-item,
	.dashboard-section-tabs .patient-lab-report-cards.rounded-lg,
	.dashboard-section-tabs .xxl\:p-6,
	.p-3,
	.md\:p-4,
	.xxl\:p-6 {
		padding: 14px !important;
	}
	.appointment-calendar-title,
	#appointment-details>.flex h2,
	.check-up-appointment h2,
	h1.tracking-tight,
	h2.tracking-tight,
	.dashboard-section--records h2,
	.dashboard-section--medications h2,
	.dashboard-section--appointments h2,
	.dashboard-section.patients_section h2,
	.dashboard-section.performance_section h2,
	.dashboard-section.overview h2,
	.dashboard-section.next-appointment>h2,
	.dashboard-section.appointments>h2,
	.dashboard-section.records>h2,
	.dashboard-section.medications>h2,
	.patient-card__title,
	.order-confirmation .thank-you h2,
	#appointment-details .check-up-appointment h2,
	#block-livelong-content .my-orders-page h2,
	.dashboard-section--patients_section .dashboard-section.patients_section h2,
	.dashboard-section-tabs h2.text-xl {
		font-size: 20px !important;
	}

	.page-title {
		font-size: 24px;
		margin-bottom: 16px;
	}

	#block-livelong-content .orders-table th,
	#block-livelong-content .orders-table td {
		padding: 10px 12px;
	}

	.doctor-card {
		flex-direction: column;
	}

	.media-card {
		flex-direction: column;
	}

	.views-exposed-form .form-text,
	.views-exposed-form .form-select {
		width: 100%;
	}

	#block-livelong-content table.views-table thead {
		display: none;
	}

	.views-exposed-form {
		border-radius: 8px;
		background: var(--addit_white);
		border: 1px solid var(--primary_border);
		padding: 15px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		transition: all 0.25s ease;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
	}

	#block-livelong-content table.views-table tbody tr {
		margin-bottom: 20px;
		border-radius: 8px;
		background: var(--addit_white);
		border: 1px solid var(--primary_border);
		padding: 10px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		transition: all 0.25s ease;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
	}

	#block-livelong-content table.views-table tbody tr:hover {
		box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
		transform: translateY(-2px);
	}

	.user-patient-dashboard table,
	#block-livelong-content table.views-table {
		margin-top: 20px;
	}

	#block-livelong-content table.views-table td {
		display: flex;
		justify-content: space-between;
		padding: 8px 5px;
		border-bottom: 1px dashed #d8d8d8;
		font-size: 14px;
	}

	#block-livelong-content table.views-table tr td:last-child {
		border-bottom: none;
	}

	#block-livelong-content table.views-table td:before {
		content: attr(data-label);
		font-weight: 600;
		color: #444;
	}

	.views-exposed-form .form--inline {
		flex-direction: row;
	}

	.views-view-table span.completed,
	.views-view-table span.pending,
	.views-view-table span.waiting-for-a-pharmacy,
	.views-view-table span.out-for-delivery,
	.views-view-table span.deactivate,
	.views-view-table span.inactive,
	.views-view-table span.issued,
	.views-view-table span.active,
	.views-view-table span.cancelled,
	.views-view-table span.in-progress,
	.views-view-table span.delivered,
	.views-view-table span.scheduled {
		padding-left: 10px;
		padding-right: 10px;
	}

	.two-column {
		grid-template-columns: 1fr;
	}

	.medication-row {
		grid-template-columns: 35px 1fr 100px;
	}

	.doctor-performance,
	.doctor-schedule,
	.doctor-upcoming {
		padding: 16px;
	}

	.doctor-patients {
		max-width: 100%;
	}

	.dashboard-section.appointments .patient-appointment__details {
		margin-left: 0;
		margin-top: 10px;
	}

	.dashboard-section.appointments .patient-card__footer {
		text-align: center;
	}

	.dashboard-section .medication-item {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	.dashboard-section .medication-info {
		margin-left: 0;
	}

	.dashboard-section .medication-time {
		text-align: left;
	}

	#user-form .field--name-field-full-name,
	#user-form .field--name-field-specialization,
	#user-form #edit-account,
	#user-form details {
		grid-column: span 2;
	}

	#pharmacy-register-form #edit-account-fields {
		flex-direction: column;
	}

	.order-page .order-timeline {
		flex-direction: column;
	}

	.order-page .timeline-step::after,
	.order-page .timeline-step::before {
		display: none;
	}

	.order-page .order-timeline {
		flex-direction: column;
		gap: 16px;
	}

	.order-page .timeline-step::after {
		display: none;
	}

	#order-update-form .order-info-card {
		padding: 20px;
	}

	#order-update-form .order-info-card .form-item {
		min-width: 100%;
	}

	#order-update-form #delivery-partner-fields {
		grid-template-columns: 1fr;
	}

	#block-livelong-primary-local-tasks ul.tabs.primary {
		gap: 6px;
	}

	#block-livelong-primary-local-tasks ul.tabs.primary li a {
		padding: 6px 10px;
		font-size: 13px;
	}

	.moderation-dashboard {
		grid-template-columns: 1fr;
	}

	.node-medication-form {
		padding: 20px;
	}

	.node-medication-form .form-actions {
		text-align: center;
	}

	#prescription-view .prescription {
		gap: 16px;
	}

	.view-appointment-calendar #single-day-container .time-box {
		padding: 0.5rem;
	}

	.view-appointment-calendar #single-day-container .time-box span {
		font-size: 0.875rem;
	}

	.view-appointment-calendar td.first {
		width: 90px;
	}

	.view-appointment-calendar #single-day-container .calendar-agenda-hour {
		font-size: 11px;
	}

	.lab-report-form .form-wrapper {
		padding: 16px;
	}

	.lab-report-form table {
		font-size: 12px;
	}


	.patient-information {
		margin-top: 20px;
	}

	#dd-user-doctors {
		padding: 16px;
	}

	#dd-user-doctors .dd-profile-avatar {
		height: 60px;
		width: 60px;
	}

	#dd-user-doctors .dd-tab {
		font-size: 13px;
		padding: 8px;
	}

	#dd-user-doctors table {
		font-size: 13px;
	}

	.dd-user-doctors {
		padding: 16px;
	}

	.dd-user-doctors .dd-profile-avatar {
		height: 60px;
		width: 60px;
	}

	.dd-user-doctors .dd-tab {
		font-size: 13px;
		padding: 8px;
	}

	.dd-user-doctors table {
		font-size: 13px;
	}

	.doctor-register-form--example {
		padding: 16px;
	}

	.doctor-register-form--example .doctor-form-section {
		padding: 14px;
	}

	.patient-manual-register-form {
		padding: 12px;
	}

	.patient-manual-register-form .form-actions {
		text-align: center;
	}

	#appointment-details .scheduled-appointment .flex.items-start {
		padding: 12px;
	}

	#prescription-view .prescription {
		gap: 16px;
	}

	.dashboard-section.appointments .patient-appointment__details {
		margin-left: 0;
		margin-top: 10px;
	}

	.dashboard-section.appointments .patient-card__footer {
		text-align: center;
	}

	.dashboard-section .medication-item {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	.dashboard-section .medication-info {
		margin-left: 0;
	}

	.dashboard-section .medication-time {
		text-align: left;
	}

	.doctor-performance {
		padding: 16px;
	}

	.doctor-patients {
		max-width: 100%;
	}



}

@media (max-width: 768px) {
	.column-4 {
		background: var(--addit_white);
		border-radius: 12px;
		box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
	}

	.dashboard-section.top_cards {
		grid-template-columns: repeat(auto-fit, minmax(47%, 1fr));
	}

	.dashboard-section.overview,
	.pharmacy-dashboard .dashboard-grid--3 {
		grid-template-columns: repeat(2, 1fr);
	}

	.views-exposed-form .form--inline .form-item {
		display: flex;
		align-items: start;
		width: 48%;
		margin: 0px;
		margin-right: 10px;
		margin-bottom: 10px;
		flex-direction: column;
	}

	.js td .dropbutton-wrapper .dropbutton-widget {
		position: static;
	}

	.js .dropbutton-wrapper {
		width: auto;
	}
}


@media (max-width: 625px) {
	.views-exposed-form .form--inline .form-item {
		width: 46%;
	}
}

@media (max-width: 640px) {
	.column-4 {
		width: 100%;
	}

	.order-confirmation {
		padding: 20px;
	}

	.order-confirmation .actions {
		flex-direction: column;
	}

	.order-confirmation .actions .button {
		width: 100%;
		text-align: center;
	}

	#views-exposed-form-pharmacy-orders-page-1 {
		padding: 16px;
	}

	#views-exposed-form-pharmacy-orders-page-1 .form-actions {
		justify-content: stretch;
	}

	#views-exposed-form-pharmacy-orders-page-1 .form-submit {
		width: 100%;
	}

	.lab-report-page .page-title {
		font-size: 22px;
	}

	.view-lab-report-view .lab-report-pdf embed {
		height: 420px;
	}

	.menu--calendar-tabs .menu {
		width: 100%;
		justify-content: space-between;
	}

	.menu--calendar-tabs .menu-item a {
		padding: 8px 12px;
		font-size: 13px;
	}

	.patient-info-card {
		padding: 14px;
	}

	.patient-info-name {
		font-size: 16px;
	}
}

@media (max-width: 610px) {
	.user-logged-in .header {
		position: sticky;
		top: 0px;
	}

	.user-logged-in .sidebarClose {
		top: 0px;
	}

	.user-logged-in .Main-content-user {
		top: 0px;
	}
}

@media (max-width: 600px) {
	#prescription-lines-wrapper table {
		border: none;
	}

	.prescription-lines-table,
	.prescription-lines-table thead,
	.prescription-lines-table tbody,
	.prescription-lines-table tr {
		display: block;
		width: 100%;
	}

	#prescription-lines-wrapper tbody td:last-child {
		border: none;
	}

	#prescription-lines-wrapper tbody td {
		border: none;
		border-bottom: 1px solid var(--primary_border);
		padding-left: 10px;
	}

	.prescription-lines-table tr .form-wrapper,
	#prescription-lines-wrapper .presc-timing-check-group .fieldset-wrapper {
		justify-content: start;
	}

	#prescription-lines-wrapper table tr {
		border-radius: 5px;
		box-shadow: 0px 0px 6px 0px #dfdfdf;
		background: var(--addit_white);
		border: none;
	}

	.prescription-lines-table thead tr {
		display: none;
	}

	.prescription-lines-table tr {
		margin-bottom: 18px;
		background: var(--addit_white);
		border-radius: 5px;
		border: 1px solid var(--primary_border);
		box-shadow: 0 1px 4px #e7e7e7;
	}

	.prescription-lines-table td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		text-align: left;
		padding: 12px 16px;
		border: none;
		border-bottom: 1px solid va(--primary_border);
		position: relative;
		font-size: 15px;
	}

	.prescription-lines-table td:last-child {
		border-bottom: none;
	}

	.prescription-lines-table td::before {
		content: attr(data-label) " ";
		font-weight: 600;
		color: #333;
		min-width: 100px;
		text-align: left;
		margin-right: 16px;
		flex-shrink: 0;
	}
}

@media (max-width:576px) {

	.dashboard-section-tabs .patient-appointment:first-child {
		margin-top: 0px;
	}

	.dashboard-section-tabs .patient-appointment {
		margin-top: 10px;
	}

	.dashboard-card .card-header h3 {
		font-size: 15px;
	}

	main.p-4 {
		padding: 15px !important;
	}

	.p-4,
	.dashboard-section-tabs .medication-item,
	.dashboard-section-tabs .patient-lab-report-cards.rounded-lg,
	.dashboard-section-tabs .xxl\:p-6,
	.p-3,
	.md\:p-4,
	.xxl\:p-6 {
		padding: 12px !important;
	}
	.appointment-calendar-title,	
	#appointment-details .check-up-appointment h2,
	.order-confirmation .thank-you h2 #appointment-details>.flex h2,
	.check-up-appointment h2,
	h1.tracking-tight,
	h2.tracking-tight,
	.dashboard-section--records h2,
	.dashboard-section--medications h2,
	.dashboard-section--appointments h2,
	.dashboard-section.patients_section h2,
	.dashboard-section.performance_section h2,
	.dashboard-section.overview h2,
	#block-livelong-content .my-orders-page h2,
	.dashboard-section.next-appointment>h2,
	.dashboard-section.appointments>h2,
	.dashboard-section.records>h2,
	.dashboard-section.medications>h2,
	.patient-card__title,
	.dashboard-section--patients_section .dashboard-section.patients_section h2,
	.dashboard-section-tabs h2.text-xl {
		font-size: 16px !important;
	}

	.dashboard-section-tabs .text-muted-foreground {
		font-size: 13px;
	}

	.dashboard-section-tabs .empty {
		text-align: center;
		padding: 9px;
		font-size: 13px;
	}

	.menu--calendar-tabs .menu-item a,
	.patient-dashboard__tabs a,
	.doctor-dashboard .doctor-dashboard__tabs a,
	.patient-dashboard .patient-dashboard__tabs a,
	.menu--calendar-tabs .menu-item a.is-active,
	.menu--calendar-tabs .menu-item--active-trail a,
	.patient-dashboard__tabs a.active,
	.doctor-dashboard .doctor-dashboard__tabs a.active,
	.patient-dashboard .patient-dashboard__tabs a.active {
		font-size: 13px;
		padding: 3px 7px;
	}

	.views-exposed-form {
		padding: 12px;
	}

	.dashboard-card {
		padding: 6px;
	}

	.dashboard-card .p-4 {
		padding: 10px !important;
	}

	.dashboard-card .card-header {
		margin-bottom: 6px !important;
	}

	.dashboard-card .card-footer {
		margin-top: 6px !important;
		padding-top: 6px !important;
	}

	.views-exposed-form .form--inline .form-item {
		width: 100%;
		margin: 0px;
	}
}

@media (max-width: 480px) {
	.select2-container{
		min-width: auto !important;
	}
	.page-title {
		font-size: 20px;
		margin-bottom: 12px;
	}

	.views-exposed-form .form--inline .form-item {
		margin-bottom: 0px;
	}

	.views-exposed-form label {
		font-size: 0.88rem;
	}

	.views-exposed-form .form-text,
	.views-exposed-form .form-select {
		height: 42px;
		font-size: 0.92rem;
	}

	.twilio-user-settings-form {
		margin: 20px;
		padding: 20px;
	}
}

@media (max-width: 400px) {
	#edit-left-vitals .fieldset-wrapper{
		    grid-template-columns: repeat(3, 1fr);
	}
	#prescription-admin-form #edit-left-prescription-options-prescription-format{
		    grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 378px) {
	
	.dashboard-section.overview {
		grid-template-columns: repeat(1, 1fr) !important;
	}

	.dashboard-section.top_cards {
		grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
	}

	.dashboard-section-tabs .md\:grid {
		grid-template-columns: repeat(1, 1fr) !important;
		gap: 10px;
	}

	.doctor-performance {
		border: 0px solid black !important;
		padding: 0px !important;
	}

	.doctor-dashboard .dashboard-section-tabs .border {
		margin: 0px;
		display: inline-grid;
		align-items: self-end;
	}
}

@media (max-width: 325px) {
	#block-livelong-content table.views-table tbody tr {
		width: 300px;
		margin: 0px;
	}

	.pharmacy-dashboard .dashboard-grid--3 {
		grid-template-columns: repeat(1, 1fr);
	}

	.views-exposed-form .form--inline .form-item {
		width: 100%;
	}
}

@media (max-width: 300px) {
	#block-livelong-content table.views-table td:before {
		display: none;
	}
}