/* ===== TG Min Side – base ===== */
.tg-minside{padding:1rem}
.tg-minside__header{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem;
  margin-bottom:1rem;
}
.tg-minside__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:1rem;
  list-style:none;
  padding:0;
  margin:0;
}

/* ===== Tile base ===== */
.tile{
  display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
  padding:1.2rem; border-radius:12px; color:#fff; text-decoration:none;
  font-size:1.1rem; font-weight:600; position:relative;
  transition:transform .15s ease, box-shadow .15s ease;
}
.tile:hover{ transform:translateY(-3px); box-shadow:0 6px 14px rgba(0,0,0,.25) }
.tile__label{ z-index:2 }
.tile__icon{
  position:absolute; right:1rem; top:50%; transform:translateY(-50%);
  font-size:1.6rem; opacity:.9;
}
.tile__badge{
  background:#ff3333; color:#fff; border-radius:999px;
  font-size:.75rem; font-weight:700; padding:.2rem .6rem; margin-left:.4rem;
}

/* ===== Infoflis (inbox) ===== */
.tile--inbox{
  background:linear-gradient(135deg,#3a3a3a,#2a2a2a);
  color:#fff; border-radius:12px;
}
.tile__title{ font-size:1.3rem; font-weight:700; margin-bottom:.4rem }
.tile__meta{ font-size:.95rem; margin-top:.4rem }

/* ===== Logo & LiMa i header ===== */
.tile--logo, .tile--lima{ border-radius:12px }
.tile--logo{
  background:#fff; display:flex; align-items:center; justify-content:center;
}
.tile--logo img.tile__logo{
  width:100%; height:100%; object-fit:cover; border-radius:inherit;
}
.tile--lima{
  background:linear-gradient(135deg,#222,#111); color:#fff; text-align:center;
}
.lima__wordmark{ font-size:2rem; font-weight:700; margin-bottom:.3rem }
.lima__l,.lima__m{ color:#f39200 } .lima__i,.lima__a{ color:#ccc }
.lima__tagline{ font-size:.9rem; font-style:italic }

/* ===== Farger på fliser (grid) ===== */
/* SIRKULÆRER → bruk .tile--orange i HTML, men blå i CSS */
.tile--orange{
  background:linear-gradient(135deg,#1e90ff,#0073e6);
}
/* Øvrige farger (som før) */
.tile--teal{      background:linear-gradient(135deg,#20c997,#0d9488) }
.tile--purple{    background:linear-gradient(135deg,#8e44ad,#6c3483) }
.tile--yellow{    background:linear-gradient(135deg,#f4d03f,#d4ac0d); color:#000 }
.tile--green{     background:linear-gradient(135deg,#2ecc71,#27ae60) }
.tile--balise{    background:linear-gradient(135deg,#f4af22,#d99000) }
.tile--banenor{   background:linear-gradient(135deg,#0052a4,#003d7a) }
.tile--fido{      background:linear-gradient(135deg,#0066cc,#004c99) }
.tile--pink{      background:linear-gradient(135deg,#e056fd,#be2edd) }
.tile--slate{     background:linear-gradient(135deg,#95a5a6,#7f8c8d) }
.tile--gold{      background:linear-gradient(135deg,#f39c12,#d68910) }
.tile--indigo{    background:linear-gradient(135deg,#3f51b5,#303f9f) }
.tile--turquoise{ background:linear-gradient(135deg,#1abc9c,#16a085) }
.tile--cobalt{    background:linear-gradient(135deg,#2980b9,#2471a3) }
.tile--charcoal{  background:linear-gradient(135deg,#34495e,#2c3e50) }
.tile--logout{    background:linear-gradient(135deg,#e74c3c,#c0392b) }

/* ===== Responsivitet ===== */
@media (max-width: 1024px){
  .tg-minside__header{ grid-template-columns:1fr }
  /* Skjul logo- og LiMa-flis på nettbrett/mobil */
  .tile--logo, .tile--lima{ display:none !important }
}
@media (max-width: 640px){
  .tg-minside{ padding:.75rem }
}
/* === Hotfix overrides (keep minimal & scoped) === */

/* SIRKULÆRER: .tile--orange skal være tydelig blå */
.tile--orange{
  background: linear-gradient(135deg, #1e90ff, #0073e6) !important;
  color:#fff !important;
}

/* LOGOFLIS: bildet skal dekke hele flisen */
.tile--logo{ background: transparent !important; }
.tile--logo img.tile__logo{
  width:100% !important;
  height:100% !important;
  object-fit: cover !important;
  display:block !important;
  border-radius: inherit !important;
}

/* LIMA-FLIS: sentrer innholdet */
.tile--lima{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
}
/* === Scoped hotfixes (minimal) === */

/* A) Desktop: bytt plass på LiMa- og Logo-flis i headeren */
@media (min-width: 1025px){
  .tg-minside__header{
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1rem !important;
  }
  /* Infoflis i kolonne 1 (uendret) */
  .tg-minside__header .tile--inbox{ grid-column: 1 !important; }
  /* LiMa i midtkolonnen */
  .tg-minside__header .tile--lima{ grid-column: 2 !important; }
  /* Logo i høyre kolonne */
  .tg-minside__header .tile--logo{ grid-column: 3 !important; }
}

/* B) Farger: Sirkulærer tydelig blå */
.tile--orange{
  background: linear-gradient(135deg, #1e90ff, #0073e6) !important;
  color:#fff !important;
}

/* C) Farger: Registrer overtid tydelig grønn (egen, ikke blå) */
.tile--cobalt{
  background: linear-gradient(135deg, #00b09b, #00a86b) !important;
  color:#fff !important;
}
/* Hotfix: skjul meldingstekst i infoflisen, behold klokke */
.tile--inbox .inbox-msg{ display:none !important; }