.container {
  justify-self: center;
  margin-left: 5px !important;
  margin-right: 5px !important;
  width: calc(100vw - 2.5rem);
}

/* Прибираємо Bootstrap-ові стрибки max-width на контейнері */
.container,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
  max-width: calc(100vw - 2.5rem) !important;
  width: calc(100vw - 2.5rem) !important;
}

#information-widgets {
  margin: 0px !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

#layout-groups {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    margin-left: 20px !important;
    margin-right: 20px !important;
}

#services {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    margin-left: 20px !important;
    margin-right: 20px !important;
}



/* Прибираємо попереднє */
li.service {
  display: block;
  padding: 3px 0px 3px 1px !important;
}


/* Розтягуємо картки через grid */
.services-list {
  align-items: stretch;
}

.services-list .service-card {
  height: 100%;
  min-height: 100px !important;
}

#headlessui-disclosure-panel-_r_9_ .services-list .service-card {
    align-content: center;
    min-height: 45px !important;
    max-height: 45px !important;
}

#headlessui-disclosure-panel-_r_b_ .services-list .service-card {
    align-content: center;
    min-height: 52px !important;
    max-height: 45px !important;
}

#headlessui-disclosure-panel-_r_b_ .service-name  {
  padding-left: 2px !important;
}

#headlessui-disclosure-panel-_r_b_ .service-description {
    color: rgb(var(--color-400) / 1);
    display: none !important;
}

/* Показуємо при достатній ширині */
#headlessui-disclosure-panel-_r_b_ .service-card {
    container-type: inline-size;
}

@container (min-width: 150px) {
    #headlessui-disclosure-panel-_r_b_ .service-description {
        display: block !important;
    }
}


#footer {
  display: none !important;
}

#headlessui-disclosure-button-_r_0_ {
  display: none !important;
}
#headlessui-disclosure-button-_r_2_ {
  display: none !important;
}
#headlessui-disclosure-button-_r_4_ {
  display: none !important;
}
#headlessui-disclosure-button-_r_6_ {
  display: none !important;
}
#headlessui-disclosure-button-_r_a_ {
  display: none !important;
}
#headlessui-disclosure-button-_r_8_ {
  display: none !important;
}



[data-name="Torrent"] .service-card {
  max-height: 150px !important;
}

[data-name="Uptime Kuma"] .service-card {
  max-height: 150px !important;
}

[data-name="Pi-hole"] .service-card {
  max-height: 150px !important;
}

[data-name="n8n"] .service-card {

  align-content: center;
  min-height: 50px !important;
}

[data-name="HOME"] .service-card {

  align-content: center;
  min-height: 50px !important;
}




.service-card {
  min-height: unset !important;
}

.service[data-name="Календар"] {
    --calendar-cell-height: 1.85rem;   /* Основна висота (можна міняти: 1.7rem - 2rem) */

    max-width: 200px !important;
}

/* Клітинки днів тижня і самі дні */
.service[data-name="Календар"] .flex.justify-between.flex-wrap > * {
    width: 14% !important;
    max-width: none !important;
}

/* Висота кнопок днів */
.service[data-name="Календар"] button {
    height: var(--calendar-cell-height) !important;
    min-height: var(--calendar-cell-height) !important;
    font-size: 0.875rem !important;     /* трохи менший шрифт */
    padding: 0 !important;
}

/* Днів тижня (пн, вт...) */
.service[data-name="Календар"] span[style*="width: 14%"] {
    height: 1.4rem !important;
    font-size: 0.8rem !important;
}

/* Корекція позиції червоних крапок (подій) */
.service[data-name="Календар"] .inline-flex.h-1.w-1 {
    transform: translateY(1px);
}

/* Трохи ущільнюємо весь блок календаря */
.service[data-name="Календар"] .pl-1.pr-1.pb-1 {
    padding-bottom: 0.25rem !important;
}

[data-name="Календар"] .service-card {
  max-height: 300px;
  
}

[data-name="Календар"] .service-card button.pl-6 {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

[data-name="Календар"] .service-name {
  display: none !important;
}


