:root {
	--display-font-family: Arima Madurai;
	--body-font-family: Arima Madurai;

	--font-size: 16px

	--logo-padding: 19px;
	--logo-height: 250px;

	--header-width: 1366px;
	--header-border-position: bottom;
	--header-border-size: 1px;
	--header-bg-color: 255 255 255;
	--header-border-color: 255 255 0;

	--brand-color: 201 0 0;
	--brand-color-inverted: 255 15 ;

	--background-color: 255 15 ;
	--text-color: 61 61 61;
	--link-color: 61 61 61;

	--action-color: 0 0 0;
	--action-color-inverted: 255 15 ;

	--announcement-bar-bg-color: 255 255 0;
	--announcement-bar-text-color: 0 0 0;
	--announcement-bar-link-color: 0 0 0;

	--main-navigation-bg-color: 255 255 255;
	--main-navigation-link-color: 61 61 61;
	--main-navigation-link-color-hover: 0 0 0;
	--main-navigation-link-bg-color: 44 81 112;
	--main-navigation-link-font-size: 16px;
	--main-navigation-link-alignment: center;

	--auxiliary-bg-color: transparent;
	--auxiliary-border-color: transparent;
	--auxiliary-link-color: 0 0 0;

	--order-status-bg-color: 255 255 255;
	--order-status-color: 0 0 0;

	--store-menu-bg_color: 248 248 248;
	--store-menu-color: 119 7 ;

	--footer-bg-color: 0 0 0;
	--footer-color: 255 15 ;
	--footer-link-color: 255 15 ;
}

/*Custom Styles*/
@media (max-width: 640px) {
  /* Kill the table layout so nothing needs horizontal scrolling */
  table.tw-min-w-full {
    display: block;
    width: 100%;
  }

  table.tw-min-w-full thead {
    display: none; /* we'll re-label cells manually below */
  }

  table.tw-min-w-full tbody {
    display: block;
  }

  table.tw-min-w-full tbody tr {
    display: block;
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
  }

  table.tw-min-w-full tbody tr td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0 !important;
    white-space: normal !important;
    text-align: left;
  }

  /* Label each column by its position, since headers are hidden */
  table.tw-min-w-full tbody tr td:nth-of-type(1)::before {
    content: "Order";
    font-weight: 600;
    color: #6b7280;
    margin-right: 1rem;
  }
  table.tw-min-w-full tbody tr td:nth-of-type(2)::before {
    content: "Delivery";
    font-weight: 600;
    color: #6b7280;
    margin-right: 1rem;
  }
  table.tw-min-w-full tbody tr td:nth-of-type(3)::before {
    content: "Status";
    font-weight: 600;
    color: #6b7280;
    margin-right: 1rem;
  }
  table.tw-min-w-full tbody tr td:nth-of-type(4)::before {
    content: "";
  }

  /* Right-align the "View" link nicely within its row */
  table.tw-min-w-full tbody tr td:last-child {
    justify-content: flex-end;
  }
}