.oatcoinCard {
  position: relative;
  overflow: hidden;
  width: 100%;
}

.oatcoinCardText {
   width: 100%;
   font-weight:bold;
   font-size:13px;
   pointer-events:auto;
   color:#fcebcf;
   text-align:left;
   font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.miningPauseButton {
   padding:4px 10px;
   background: var(--color-primary);
   color:#3e2b16;
   font-weight:bold;
   border:none;
   border-radius:4px;
   cursor:pointer;
}

.oatcoinMiningAllocationButton {
   font-size: 13px;
   flex: 1; 
   padding: 4px 6px; 
   background: #3e2b16; 
   color: #fcebcf; 
   border: 1px solid var(--color-primary);
   border-radius: 4px; 
   cursor: pointer; 
}

.alwaysMaxMiningLabel {
   display: flex; 
   align-items: center; 
   gap: 6px; 
   font-size: 13px; 
   color: #fcebcf; 
   cursor: pointer;
}

.total-workers-count {
   padding: 4px;
   color: var(--color-darker);
   font-size:14px;
}

.worker-segment-wrapper {
   display: flex;
   flex-wrap: wrap;
   gap: 2px;
   background: #eee;
   border-radius: 4px;
   flex-grow: 1;
   flex-basis: 0;
   max-width: 100%;
   min-height: 14px;
}

.worker-segment {
   position: relative;
   width: 8px;
   height: 8px;
   background: #999;
   opacity: 0.6;
   border-radius: 2px;
   overflow: hidden;
}

.worker-assignment-wrapper {
   display: flex;
   flex-direction: column; 
   padding: 0 8px;
   width: calc(100% - 16px);
   border: 2px solid var(--color-primary);
   border-radius: 8px;
}

.worker-assignment-header {
   font-size: 14px; 
   color: var(--color-darker);
   font-weight: bold; 
   padding:8px;
}

.worker-assignment-control-wrapper {
   display: flex;
   align-items: flex-start;
   gap: 8px;
}

.worker-button {
   min-width: 22px;
   width: 22px;
   height: 22px;
   font-size: 12px;
   font-weight: bold;
   background: #eee;
   border: 1px solid #ccc;
   border-radius: 4px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.worker-button-plus {
   align-self: flex-start;
}

.workers-count {
   font-size: 12px; 
   color: var(--color-darker);
   padding:8px;
}

.asset-management-img {
   width: 100%;
   aspect-ratio: 5 / 7;
   object-fit: cover;
   transition: filter 0.3s;
   display: block;
}

.bank-overlay {
   position: absolute;
   top: 0; left: 0; right: 0; bottom: 0;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   padding-top: 16px;
   padding-left:4px;
   padding-right:4px;
   padding-bottom: 3px;
   text-align: center;
   color: #fff;
   text-shadow: 1px 1px 2px black;
   pointer-events: auto;
}

.asset-management-overlay {
   padding: 10px;
   font-weight: bold;
   font-size: 16px;
   pointer-events: none;
}

.bank-overlay-text {
   font-weight:bold;
   font-size:14px;
   color:#fcebcf;
}

.bank-title {
   font-weight: bold; 
   font-size: 20px;
   text-align: center;
}

.bank-button {
   padding: 6px 12px;
   background-color: var(--color-primary);
   color: #2e1f0f;
   border: none;
   border-radius: 6px;
   font-weight: bold;
   cursor: pointer;
}

.oatron-wrapper {
   width: 100%;
   max-width: 300px;
   margin: 0 auto;
   position: relative;
   aspect-ratio: 5 / 7;
   overflow: hidden;
   border-radius: 8px;
}

.economy-health-bar-container {
   width: calc(100% - 24px);
   height: 16px;
   background: #444;
   border-radius: 8px;
   overflow: hidden;
   margin: 4px 12px;
}

.economy-health-bar {
   height: 100%; 
   transition: background-color 0.3s;
}


.oatronAcceleratorWrapper {
   width: 100%;
   padding: 8px;
   background: #f7f3e9;
   border: 2px solid var(--color-primary);
   border-radius: 8px;
   overflow: hidden;
   display: flex;
   flex-direction: column;
   color: #3e2b16;
   box-sizing: border-box;
   gap: 8px;
}

#oatronVideo {
   position: absolute;
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: none;
   pointer-events: none;
}

.oatron-img {
   position: absolute;
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
}

.oatron-burn-bar.buyToggleBtn {
   width: 100%;
   height: 30px;
   position: relative;
   cursor: pointer;
   overflow: hidden;
   box-sizing: border-box;
}

#oatronBurnFill {
   width: 100%;
   height: 100%;
   background-color: #ff774d;
   position: absolute;
   top: 0;
   left: 0;
   z-index: 0;
}

#oatronBurnText {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   display: flex;
   font-size: 14px;
   align-items: center;
   justify-content: center;
   font-weight: bold;
   color: var(--color-darker);
   z-index: 1;
   pointer-events: none;
}

/* Rice Cake Theme */
.buyToggleBtn.btn-cakes {
   background: #ffdeac;
   border-color: #a07141;
   color: #4a2e10;
   padding: 3px 8px;
}

.buyToggleBtn.btn-cakes:hover,
.buyToggleBtn.btn-cakes.active {
   background: #ffcc7e;
}

/* Gummy Bear Theme */
.buyToggleBtn.btn-gumdrops {
   background: rgba(255, 155, 155, 0.75);
   border-color: #b02020;
   color: #4a2e10;
   padding: 3px 8px;
}

.buyToggleBtn.btn-gumdrops:hover,
.buyToggleBtn.btn-gumdrops.active {
   background: rgb(255, 105, 105);
}

.oatron-load-wrapper {
   color: #fcebcf;
   box-sizing:border-box;
   padding: 8px;
   border: 2px solid;
   border-radius: 8px;
}

.oatron-load-wrapper.oatron-load-wrapper-cakes {
   background: rgb(255, 245, 217);
   border-color: #b68b5a;
}

.oatron-load-wrapper.oatron-load-wrapper-gumdrops {
   background: rgb(253, 216, 216);
   border-color: #b02020;
}

.oatron-load-wrapper.oatron-technician-wrapper {
   border-color: #cc5500;
   background-color: rgb(253, 222, 202);
}

.oatron-load-wrapper.oatron-burn-wrapper {
   border-color: #cc5500;
   background-color: rgb(253, 222, 202);
}

.oatron-load-btn {
   width: 100%;
}

.oatron-load-label {
   font-size: 14px !important;
   font-weight: bold;
   padding-bottom: 2px;
   color: #4a2e10;
}

.oatron-burn-duration-label {
   font-size: 14px;
   font-weight: bold;
   color: var(--color-darker);
   line-height: 1.5;
}

.buyToggleBtn.btn-oatronTechnician {
   width: 100%;
   padding: 3px;
   color: #4a2e10;
   box-sizing: border-box;
   font-size: 13px;
   font-family: Arial, Helvetica, sans-serif;
   font-weight: bold;
   background-color: #ffa187;
   border-color: #cc5500;
}

.buyToggleBtn.btn-oatronTechnician:hover,
.buyToggleBtn.btn-oatronTechnician.active {
   background-color: #ff774d;
}

.buyToggleBtn.btn-oatronTechnician.disabled {
   background-color: #bbb;
   border-color: #999;
   color: #666;
   opacity: 0.6;
   cursor: not-allowed;
   pointer-events: none;
}