/*
 * WORKHOUR
 * Fil: workhour-report-v2.css
 * Version: 2.1.11
 * Senast ändrad: 2026-09-29
 *
 * Ändring 2.1.11: Textfokus på mobil fyller den synliga viewporten ovanför tangentbordet och förankrar dialogen högst upp.
 * Ändring 2.1.10: TinyMCE-toolbar döljs endast i V2-tidrapporten på mobil (max 768px).
 * Ändring 2.1.9: Döljer den faktiska V2-källkontrollen .wh-v2-date-source; inputen behålls som datumkälla.
 * Ändring 2.1.8: Det gamla datumfältet i Fler val döljs i V2; datum väljs endast via datumknappen i tidraden.
 * Ändring 2.1.7: Tidväljare och datum linjeras mot samma topp/baslinje i wh-v2-time-row.
 * Ändring 2.1.6: Tidsväljare och datum får samma höjd. Snabbval behåller fyra kolumner och tidsvärden hålls på en rad.
 * Ändring 2.1.5: Återställer senaste V2-designen och kompletterar tidraden: editor utan yttre grå kortyta, mindre +/- och datum på samma rad.
 * Ändring 2.1.1: V2-anpassad uppgiftslista med tydligt val, status och Klar-knapp.
 *
 * Beskrivning: Responsiv V2-design för Rapportera tid i PWA, mobil och desktop.
 * Ändring 2.1.0: Samma V2-layout används i alla webblägen; desktop får endast responsiv bredd/anpassning.
 * Ändring 2.0.6: Snabbvalen behåller fyra lika breda knappar när de expanderas.
 * Ändring 2.0.5: Kompakt grundläge, progressiva snabbval och inramad datumkontroll.
 * Påverkar endast #timeDialog.wh-report-v2 och lämnar V1 oförändrad.
 *
 * VIKTIGT:
 * Ändringar ska alltid göras med denna version eller en senare som utgångspunkt.
 */
  #timeDialog.wh-report-v2 .wh-report-panel{background:#fff}
  #timeDialog.wh-report-v2 .wh-report-panel>header{padding-bottom:4px}
  #timeDialog.wh-report-v2 .wh-report-fields{padding:4px 10px 16px}
  #timeDialog.wh-report-v2 .wh-v2-shell{display:flex;flex-direction:column;gap:10px}
  #timeDialog.wh-report-v2 .wh-v2-date{min-height:46px;border:1px solid #dfe3e8;border-radius:13px;background:#fff;display:grid;grid-template-columns:24px 1fr 18px;align-items:center;text-align:left;padding:6px 12px;color:var(--foreground);font-size:15px}
  #timeDialog.wh-report-v2 .wh-v2-date .fa-chevron-right{font-size:11px;color:#87909b}
  #timeDialog.wh-report-v2 .wh-v2-card,#timeDialog.wh-report-v2 .wh-v2-extra{border:1px solid #e7e9ed;border-radius:16px;background:#f7f8fa;overflow:hidden}
  #timeDialog.wh-report-v2 .wh-v2-card-head,#timeDialog.wh-report-v2 .wh-v2-extra-toggle{width:100%;min-height:58px;border:0;background:transparent;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;text-align:left;color:var(--foreground)}
  #timeDialog.wh-report-v2 .wh-v2-card-head>span,#timeDialog.wh-report-v2 .wh-v2-extra-toggle>span{display:flex;align-items:center;gap:10px}
  #timeDialog.wh-report-v2 .wh-v2-card-head i,#timeDialog.wh-report-v2 .wh-v2-extra-toggle i{font-size:18px}
  #timeDialog.wh-report-v2 .wh-v2-card-head strong{font-size:17px}
  #timeDialog.wh-report-v2 .wh-v2-description-head{display:grid;grid-template-columns:auto 1fr;gap:10px}
  #timeDialog.wh-report-v2 .wh-v2-description-head small{grid-column:1/-1;color:#7d8692;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
  #timeDialog.wh-report-v2 .wh-v2-card-body{padding:0 10px 10px}
  #timeDialog.wh-report-v2 .wh-report-time>span{display:none}
  #timeDialog.wh-report-v2 .wh-report-time{margin:0;padding:0;border:0;background:transparent}
  #timeDialog.wh-report-v2 .wh-report-policy{display:none}
  #timeDialog.wh-report-v2 .wh-report-time-modes{border:1px solid #d8dce2;background:#fff;border-radius:13px;padding:2px}
  #timeDialog.wh-report-v2 .wh-report-time-mode{min-height:42px;border-radius:11px}
  #timeDialog.wh-report-v2 .wh-report-stepper{margin-top:8px}
  #timeDialog.wh-report-v2 .wh-v2-time-row{display:flex;align-items:flex-start;gap:8px;width:100%;min-width:0;margin-top:8px}
  #timeDialog.wh-report-v2 .wh-v2-time-row .wh-report-stepper{box-sizing:border-box;flex:1 1 auto;min-width:0;height:48px;min-height:48px;max-height:48px;margin-top:0;margin-bottom:0}
  #timeDialog.wh-report-v2 .wh-v2-time-row .wh-report-stepper>button[data-report-step]{box-sizing:border-box;flex:0 0 40px;width:40px;height:40px;min-width:40px;min-height:40px;max-width:40px;max-height:40px;padding:0;border-radius:50%}
  #timeDialog.wh-report-v2 .wh-v2-time-row .wh-report-duration{flex:1 1 auto;min-width:0;font-size:20px;white-space:nowrap}
  #timeDialog.wh-report-v2 .wh-v2-time-row>.wh-v2-date{box-sizing:border-box;display:flex;align-items:center;justify-content:center;flex:0 0 76px;width:76px;min-width:76px;max-width:76px;height:48px;min-height:48px;margin-top:0;margin-bottom:0;padding:0 8px;border:1px solid #dfe3e8;border-radius:12px;background:#fff;color:var(--foreground);font-size:14px;white-space:nowrap;text-align:center}
  #timeDialog.wh-report-v2 .wh-report-quick-times{display:none;margin-top:8px;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  #timeDialog.wh-report-v2 .wh-report-quick-times>button{min-width:0;white-space:nowrap;font-size:clamp(13px,3.8vw,16px);padding-left:4px;padding-right:4px}
  #timeDialog.wh-report-v2.wh-report-v2-quick-open .wh-report-quick-times{display:grid}
  #timeDialog.wh-report-v2 .wh-v2-description-card{border-color:transparent;background:#fff;overflow:visible}
  #timeDialog.wh-report-v2 .wh-v2-description-card .wh-v2-card-body{padding-left:0;padding-right:0;padding-bottom:0}
  #timeDialog.wh-report-v2 .wh-v2-description-card .wh-v2-card-body>label{margin:0;font-size:0}
  #timeDialog.wh-report-v2 .wh-v2-description-card textarea{min-height:230px;font-size:16px;line-height:1.45;background:#fff}
  #timeDialog.wh-report-v2 .wh-v2-description-card .tox-tinymce{border:1px solid #dfe3e8!important;border-radius:12px!important;min-height:280px}
  #timeDialog.wh-report-v2 .wh-v2-extra{margin-top:auto;background:#fff}
  #timeDialog.wh-report-v2 .wh-v2-extra-toggle{min-height:52px}
  #timeDialog.wh-report-v2 .wh-v2-extra-toggle .fa-circle-plus{color:var(--primary)}
  #timeDialog.wh-report-v2 .wh-v2-extra-body{display:none;border-top:1px solid #e7e9ed;padding:4px 12px 12px}
  #timeDialog.wh-report-v2.wh-report-v2-extra-open .wh-v2-extra-body{display:block}
  #timeDialog.wh-report-v2.wh-report-v2-extra-open .wh-v2-extra-toggle>.fa-chevron-down{transform:rotate(180deg)}
  #timeDialog.wh-report-v2 .wh-v2-extra-row{min-height:54px;display:grid;grid-template-columns:24px 1fr 16px;gap:10px;align-items:center;border-bottom:1px solid #eceef1;padding:5px 2px}
  #timeDialog.wh-report-v2 .wh-v2-extra-row span{display:flex;flex-direction:column;min-width:0}
  #timeDialog.wh-report-v2 .wh-v2-extra-row small{color:#7d8692;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-options{border:0;border-radius:0;background:transparent;margin:0}
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-options>summary{display:none}
  #timeDialog.wh-report-v2 .wh-report-context-fields{padding:8px 0 12px}
  #timeDialog.wh-report-v2 .wh-v2-extra-body>label,#timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-tasks,#timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-uploads{margin:8px 0 12px}
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-uploads .wh-media-gallery-tile,#timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-uploads .wh-media-tile{width:72px!important;height:72px!important}
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-uploads .wh-media-gallery-add,#timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-uploads .wh-media-add,#timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-uploads .wh-upload-pick{width:72px!important;height:72px!important;min-width:72px!important;min-height:72px!important;max-width:72px!important;max-height:72px!important;padding:6px!important}
  #timeDialog.wh-report-v2 .wh-v2-native-time{position:fixed;left:-9999px;top:-9999px;width:1px;height:1px;opacity:0}
  #timeDialog.wh-report-v2 .dialog-actions{padding:10px 0 max(10px,env(safe-area-inset-bottom))}
  #timeDialog.wh-report-v2 .save-btn{min-height:50px;border-radius:14px}
  /* Grundläge: tid + beskrivning. */
  #timeDialog.wh-report-v2:not(.wh-report-v2-text-focus):not(.wh-report-v2-extra-open) .wh-v2-time-head,#timeDialog.wh-report-v2:not(.wh-report-v2-text-focus):not(.wh-report-v2-extra-open) .wh-v2-description-head{display:none}
  #timeDialog.wh-report-v2:not(.wh-report-v2-text-focus):not(.wh-report-v2-extra-open) .wh-v2-time-card .wh-v2-card-body,#timeDialog.wh-report-v2:not(.wh-report-v2-text-focus):not(.wh-report-v2-extra-open) .wh-v2-description-card .wh-v2-card-body{padding-top:10px}
  #timeDialog.wh-report-v2:not(.wh-report-v2-text-focus):not(.wh-report-v2-extra-open) .wh-v2-time-card .wh-v2-card-body{display:block}
  #timeDialog.wh-report-v2:not(.wh-report-v2-text-focus):not(.wh-report-v2-extra-open) .wh-v2-description-card .wh-v2-card-body{display:block}
  /* Textfokus: endast rubriken, Klar och editorn visas. Datum/tid/fler alternativ döljs så editorn börjar högst upp i formulärytan. */
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-date,#timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-time-card,#timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-extra{display:none}
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-shell{gap:0}
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-description-card{order:-1;border-color:transparent;background:#fff}
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-description-head{display:none}
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-description-card .wh-v2-card-body{padding:0}
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-description-card .tox-tinymce{min-height:330px}
  /* Fler alternativ: huvudfälten blir små sammanfattningar och lämnar plats åt valen. */
  #timeDialog.wh-report-v2.wh-report-v2-extra-open .wh-v2-time-card .wh-v2-card-body,#timeDialog.wh-report-v2.wh-report-v2-extra-open .wh-v2-description-card .wh-v2-card-body{display:none}
  #timeDialog.wh-report-v2.wh-report-v2-extra-open .wh-v2-card-head{min-height:50px}
  #timeDialog.wh-report-v2.wh-report-v2-extra-open .wh-v2-extra{background:#f7f8fa}

  #timeDialog.wh-report-v2 .wh-v2-editor-actions{display:none;align-items:center;justify-content:flex-end;padding:0 0 8px}
  #timeDialog.wh-report-v2 .wh-v2-editor-done{border:0;background:transparent;color:var(--primary);font:inherit;font-weight:700;min-height:40px;padding:4px 8px;display:flex;align-items:center;gap:7px}
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-editor-actions{display:flex;position:sticky;top:0;z-index:4;background:#fff}
  /* Fler alternativ använder endast originalkontrollerna, en gång vardera. */
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-options{display:none!important}
  #timeDialog.wh-report-v2 .wh-v2-extra-body>label,
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-tasks,
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-uploads,
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-person-mode,
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-person-hint{margin:10px 0 14px}
  #timeDialog.wh-report-v2 .wh-v2-extra-body>.wh-report-tasks{padding:0}
  #timeDialog.wh-report-v2 .wh-v2-date-source{display:none!important}

  /* Uppgifter i V2: egen presentation ovanpå befintlig report-data. */
  #timeDialog.wh-report-v2 .wh-report-tasks .wh-v2-task-original-summary{display:none!important}
  #timeDialog.wh-report-v2 .wh-v2-task-picker{display:flex;flex-direction:column;gap:8px;margin-top:6px}
  #timeDialog.wh-report-v2 .wh-v2-task-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;border:1px solid #dfe3e8;border-radius:13px;background:#fff;overflow:hidden;transition:border-color .15s ease,background .15s ease}
  #timeDialog.wh-report-v2 .wh-v2-task-row.is-selected{border-color:var(--primary);background:#fff}
  #timeDialog.wh-report-v2 .wh-v2-task-select{min-width:0;min-height:58px;border:0;background:transparent;padding:10px 12px;display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:center;text-align:left;color:var(--foreground)}
  #timeDialog.wh-report-v2 .wh-v2-task-check{width:22px;height:22px;display:flex;align-items:center;justify-content:center;color:#87909b;font-size:19px}
  #timeDialog.wh-report-v2 .wh-v2-task-row.is-selected .wh-v2-task-check{color:var(--primary)}
  #timeDialog.wh-report-v2 .wh-v2-task-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
  #timeDialog.wh-report-v2 .wh-v2-task-title{font-size:15px;line-height:1.3;font-weight:650;white-space:normal;overflow-wrap:anywhere}
  #timeDialog.wh-report-v2 .wh-v2-task-state{font-size:13px;line-height:1.25;color:#7d8692}
  #timeDialog.wh-report-v2 .wh-v2-task-row.is-selected:not(.is-done) .wh-v2-task-state{color:var(--primary)}
  #timeDialog.wh-report-v2 .wh-v2-task-row.is-done .wh-v2-task-state{color:#5f6873}
  #timeDialog.wh-report-v2 .wh-v2-task-status{min-width:74px;border:0;border-left:1px solid #eceef1;background:transparent;padding:8px 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#7d8692;font:inherit;font-size:12px;font-weight:700}
  #timeDialog.wh-report-v2 .wh-v2-task-status i{font-size:18px}
  #timeDialog.wh-report-v2 .wh-v2-task-status:disabled{opacity:.38;cursor:default}
  #timeDialog.wh-report-v2 .wh-v2-task-row.is-done .wh-v2-task-status{color:var(--primary)}
  #timeDialog.wh-report-v2 .wh-v2-task-empty,#timeDialog.wh-report-v2 .wh-v2-task-error{min-height:50px;border:1px dashed #dfe3e8;border-radius:13px;background:#fff;padding:10px 12px;display:flex;align-items:center;gap:9px;color:#7d8692;font-size:14px}

/* Desktop använder samma V2-design. Endast yta och proportioner anpassas. */
@media (min-width:769px) {
  #timeDialog.wh-report-v2 .wh-report-panel{width:min(680px,calc(100vw - 48px));max-width:680px}
  #timeDialog.wh-report-v2 .wh-report-fields{padding:10px 18px 20px}
  #timeDialog.wh-report-v2 .wh-v2-shell{gap:12px}
  #timeDialog.wh-report-v2 .wh-v2-description-card textarea{min-height:250px}
  #timeDialog.wh-report-v2 .wh-v2-description-card .tox-tinymce{min-height:300px}
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-description-card .tox-tinymce{min-height:min(560px,65vh)}
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-v2-editor-actions{top:0}
}

/* Mobil: tidrapportens TinyMCE visas som en ren skrivyta. På desktop är toolbaren kvar. */
@media (max-width:768px) {
  #timeDialog.wh-report-v2 .tox-tinymce .tox-editor-header{display:none!important}
  #timeDialog.wh-report-v2 .tox-tinymce .tox-sidebar-wrap{min-height:inherit}
}

@media (max-width:768px) {
  #timeDialog.wh-report-v2.wh-report-v2-text-focus{
    align-items:flex-start!important;
    padding-top:0!important;
  }
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-report-panel{
    top:0!important;
    margin-top:0!important;
    height:var(--wh-v2-visible-height,100dvh)!important;
    max-height:var(--wh-v2-visible-height,100dvh)!important;
    border-radius:0!important;
  }
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .form-scroll,
  #timeDialog.wh-report-v2.wh-report-v2-text-focus .wh-report-fields{
    max-height:none!important;
  }
}